b2black

Obrigado, resolvido! Nem precisou de JS.

Ajuda com script para que, quando o usuário rolar a página, o menu fica fixed, e quando ele voltar ao topo, fica static. <div id="navbar" class="navbar"> <a href="index.php"> <img src="https://i.ibb.co/Z2TKYRX/artx-logo-text.png" alt="Art X" class="artx-logo"> </a> <nav id="nav"> <button aria-label="Abrir Menu" id="btn-mobile" aria-haspopup="true" aria-controls="menu" aria-expanded="false"> <span id="hamburger"></span> </button> <ul id="menu" role="menu"> <li><a href="index.php">Inicio</a></li> <li><a href="">Portfólio</a></li> <li><a href="">Clientes</a></li> <li><a href="">Institucional</a></li> <li><a href="">Contato</a></li> </ul> </nav> <div class="btn-finance"> <button><a href="orc.php">Solicite um orçamento</a></button> </div> </div> #navbar { box-sizing: border-box; width: 100%; position: static; top: 0; height: 50px; padding: 1rem; display: flex; align-items: center; justify-content: space-around; background: rgba(255, 255, 255, 0.35); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); } .artx-logo { margin-top: 5px; } .navbar { width: 100%; position: fixed; top: 0; background: rgba(255, 255, 255, 0.35); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); } #menu { display: flex; list-style: none; gap: 0.5rem; } #menu a { display: block; padding: 2rem; color: #131313; font-size: 14px; } #menu a:hover { background: -webkit-linear-gradient(-70deg, #be79b2 30%, #884593 50%, #3f2c52 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; -webkit-box-decoration-break: clone; } #btn-mobile { display: none; } @media (max-width: 900px) { .btn-finance {display: none;} } @media (max-width: 768px) { .btn-finance {display: none;} .artx-btn { display: none; } #menu { display: block; position: absolute; width: 100%; top: 50px; right: 0px; background-color: white; transition: 0.6s; z-index: 1000; height: 0px; visibility: hidden; overflow-y: hidden; } #nav.active #menu { height: calc(100vh - 50px); visibility: visible; overflow-y: auto; } #menu a { padding: 1rem 0; margin: 0 1rem; border-bottom: 2px solid rgba(0, 0, 0, 0.05); } #btn-mobile { display: flex; padding: 0.5rem 1rem; font-size: 1rem; border: none; background: none; cursor: pointer; gap: 0.5rem; } #hamburger { border-top: 2px solid; width: 20px; } #hamburger::after, #hamburger::before { content: ''; display: block; width: 20px; height: 2px; background: #131313; margin-top: 5px; transition: 0.3s; position: relative; } #nav.active #hamburger { border-top-color: transparent; } #nav.active #hamburger::before { transform: rotate(135deg); } #nav.active #hamburger::after { transform: rotate(-135deg); top: -7px; } } .btn-finance button { background: linear-gradient(to bottom, #884593 5%, #884593 100%); background-color: #ffffff; border: none; display: inline-block; cursor: pointer; color: #ffffff; font-size: 14px; padding: 5px 10px; text-decoration: none; -webkit-transition: 0.5s ease; transition: 0.5s ease; } .btn-finance button a { color: white; } .btn-finance button:hover { border: none; background: linear-gradient(to bottom, #131313 5%, #131313 100%); background-color: #131313; display: inline-block; cursor: pointer; color: white; font-size: 14px; text-decoration: none; -webkit-transition: 0.5s ease; transition: 0.5s ease; }

É isso mesmo, só que quando chega na metade da página, o menu some, como resolver?

Estou tentando alinhar um menu dentro do header, e dentro do header tem 2 div, qual a ordem de respeito das funções? <header> <div class="menuwrap"> <div class="menu"> <nav> <ul> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> <li><a href="">Produto</a></li> </ul> </nav> </div> </div> </header> body {margin: 0; padding: 0;} header { display: flex; flex-wrap: wrap; justify-content: space-between; height: 5vh; background: red; } .menuwrap {} .menu {} .menu ul {} .menu li{display: inline-block;}

Então, estou tentando criar um submenu com opções quando o usuário passa o link em cima da imagem, porém não estou conseguindo, qual é o jeito certo de fazer? Ao clicar no link (link-login) que é uma imagem colocada com css, abre um menu abaixo da imagem com 5 opções de link <div class="nav-container"> <nav> <ul class="desktop-nav"> <li> <a href="" class="link-logo"></a> </li> <li> <a href="">Charm Points</a> </li> <li> <a href="">Ranking</a> </li> <li> <a href="">Colaboradores</a> </li> <li> <a href="">Blog</a> </li> <li> <a href="">Eventos</a> </li> <li> <a href="">Suporte</a> </li> <li> <!--<a href="" class="link-search"></a>--> <form method="get" action="" class="search"> <input name="boxsearch" type="search-text" placeholder="" /> </form> </li> <li> <a href="" class="link-bag"></a> </li> <li> <a href="" class="link-login"></a> </li> </ul> </nav> </div> .link-login { background: url('avatar.png'); background-repeat: no-repeat; display: block; background-position: center; background-size: 20px; height: 44px; width: 20px; } .link-login:hover { position: relative; display: inline-block; margin-top: 50px; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); padding: 12px 16px; z-index: 1; }

Incrível, apenas 2 linhas de código, muito obrigado!

Estava vendo para atualizar o Windows pro 11, e notei isso no site da Microsoft, alguém sabe qual repositorio, ou como pesquisar para desenvolver algo similar? Quando você rola a página, o menu fica transparente. Explore Windows 11 OS, Computers, Apps, & More | Microsoft

Só para encerrar, na pagina de update, quando aperto submit para alterar as informações do cadastro, acontece o seguinte erro: Fatal error: Uncaught TypeError: mysqli_stmt_close(): Argument #1 ($statement) must be of type mysqli_stmt, bool given in C:\xampp\htdocs\ERP\update.php:92 Stack trace: #0 C:\xampp\htdocs\ERP\update.php(92): mysqli_stmt_close(false) #1 {main} thrown in C:\xampp\htdocs\ERP\update.php on line 92. Segue a página de código: <?php require_once "config.php"; $name = $cpf = $phone = $gender = $dayagend = $houragend = ""; $name_err = $cpf_err = $phone_err = $gender_err = $dayagend_err = $houragend_err = ""; if(isset($_POST["id"]) && !empty($_POST["id"])){ $id = $_POST["id"]; $input_name = trim($_POST["name"]); if(empty($input_name)){ $name_err = "Por favor, insira o nome do cliente."; } elseif(!filter_var($input_name, FILTER_VALIDATE_REGEXP, array("options"=>array("regexp"=>"/^[a-zA-Z\s]+$/")))){ $name_err = "Por favor, é necessário inserir o nome do cliente."; } else{ $name = $input_name; } $input_cpf = trim($_POST["cpf"]); if(empty($input_cpf)){ $cpf_err = "Digite o CPF do cliente a ser agendado."; } elseif(!ctype_digit($input_cpf)){ $cpf_err = "Por favor, insira apenas números."; } else{ $cpf = $input_cpf; } $input_phone = trim($_POST["phone"]); if(empty($input_phone)){ $phone_err = "Digite o número de telefone do cliente."; } else{ $phone = $input_phone; } $input_gender = trim($_POST["gender"]); if(empty($input_gender)){ $gender_err = "Escolha o gênero sexual do cliente."; } else{ $gender = $input_gender; } $input_dayagend = trim($_POST["dayagend"]); if(empty($input_dayagend)){ $dayagend_err = "Selecione a data de agendamento do cliente."; } else{ $dayagend = $input_dayagend; } $input_houragend = trim($_POST["houragend"]); if(empty($input_houragend)){ $houragend_err = "Selecione o horário de agendamento do cliente."; } else{ $houragend = $input_houragend; } if (empty($name_err) && empty($cpf_err) && empty($phone_err) && empty($gender_err) && empty($dayagend_err) && empty($houragend_err)){ $sql = "UPDATE schedule SET name=?, cpf=?, phone=?, gender=?, dayagend=?, houragend=?, WHERE id=?"; if($stmt = mysqli_prepare($link, $sql)){ mysqli_stmt_bind_param($stmt, "ssssssi", $param_name, $param_cpf, $param_phone, $param_gender, $param_dayagend, $param_houragend, $param_id); $param_name = $name; $param_cpf = $cpf; $param_phone = $phone; $param_gender = $gender; $param_dayagend = $dayagend; $param_houragend = $houragend; $param_id = $id; if(mysqli_stmt_execute($stmt)){ header("location: index.php"); exit(); } else{ echo "Ops! Algo deu errado. Por favor, tente novamente mais tarde."; } } mysqli_stmt_close($stmt); } mysqli_close($link); } else{ if(isset($_GET["id"]) && !empty(trim($_GET["id"]))){ $id = trim($_GET["id"]); $sql = "SELECT * FROM schedule WHERE id = ?"; if($stmt = mysqli_prepare($link, $sql)){ mysqli_stmt_bind_param($stmt, "i", $param_id); $param_id = $id; if(mysqli_stmt_execute($stmt)){ $result = mysqli_stmt_get_result($stmt); if(mysqli_num_rows($result) == 1){ $row = mysqli_fetch_array($result, MYSQLI_ASSOC); $name = $row["name"]; $cpf = $row["cpf"]; $phone = $row["phone"]; $gender = $row["gender"]; $dayagend = $row["dayagend"]; $houragend = $row["houragend"]; } else{ header("location: error.php"); exit(); } } else{ echo "Ops! Algo deu errado. Por favor, tente novamente mais tarde."; } } // Close statement mysqli_stmt_close($stmt); // Close connection mysqli_close($link); } else{ // URL doesn't contain id parameter. Redirect to error page header("location: error.php"); exit(); } } ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Atualizar Cadastro</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> <style> .wrapper{ width: 600px; margin: 0 auto; } </style> </head> <body> <div class="wrapper"> <div class="container-fluid"> <div class="row"> <div class="col-md-12"> <h2 class="mt-5">Atualizar Cliente</h2> <p>Insira as informações para atualizar o cadastro do cliente.</p> <form action="<?php echo htmlspecialchars(basename($_SERVER['REQUEST_URI'])); ?>" method="post"> <div class="form-group"> <label>NOME</label> <input type="text" name="name" class="form-control <?php echo (!empty($name_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $name; ?>"> <span class="invalid-feedback"><?php echo $name_err;?></span> </div> <div class="form-group"> <label>CPF</label> <input type="text" name="cpf" class="form-control <?php echo (!empty($cpf_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $cpf; ?>"> <span class="invalid-feedback"><?php echo $cpf_err;?></span> </div> <div class="form-group"> <label>TELEFONE</label> <input type="text" name="phone" class="form-control <?php echo (!empty($phone_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $phone; ?>"> <span class="invalid-feedback"><?php echo $phone_err;?></span> </div> <div class="form-group"> <label>GÊNERO</label> <input type="text" name="gender" class="form-control <?php echo (!empty($gender_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $gender; ?>"> <span class="invalid-feedback"><?php echo $gender_err;?></span> </div> <div class="form-group"> <label>DIA AGENDADO</label> <input type="text" name="dayagend" class="form-control <?php echo (!empty($dayagend_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $dayagend; ?>"> <span class="invalid-feedback"><?php echo $dayagend_err;?></span> </div> <div class="form-group"> <label>HORA AGENDADA</label> <input type="text" name="houragend" class="form-control <?php echo (!empty($houragend_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $houragend; ?>"> <span class="invalid-feedback"><?php echo $houragend_err;?></span> </div> <input type="hidden" name="id" value="<?php echo $id; ?>"/> <input type="submit" class="btn btn-primary" value="Submit"> <a href="index.php" class="btn btn-secondary ml-2">Cancel</a> </form> </div> </div> </div> </div> </body> </html>

Quando preencho o cadastro e clico em cadastrar, a informação não é salva no banco de dados, e também, como pode ver na imagem action2, as informações digitadas permanecem nos campos imput e o nome vai para o alerta de erro de mensagem em baixo do campo.... <?php require_once "config.php"; $idclient = $fullname = $cpfclient = $gender = $phone = $email = $dayagend = $houragend = ""; $idclient_err = $fullname_err = $cpfclient_err = $gender_err = $phone_err = $email_err = $dayagend_err = $houragend_err = ""; if($_SERVER["REQUEST_METHOD"] == "POST"){ // $input_idclient = trim($_POST["idclient"]); if(empty($input_idclient)){ $idclient_err = "ID de identificação do cliente."; } else{ $idclient = $input_idclient; } $input_fullname = trim($_POST["fullname"]); if(empty($input_fullname)){ $fullname_err = "Por favor, insira o nome completo do cliente."; /*} elseif(!filter_var($input_fullname, FILTER_VALIDATE_REGEXP, array("options"=>array("regexp"=>"/^[a-zA-Z\s]+$/")))){ $fullname_err = "Por favor, insira um nome válido de cliente.";*/ } else{ $fullname = $input_fullname; } $input_cpfclient = trim($_POST["cpfclient"]); if(empty($input_cpfclient)){ $cpfclient_err = "Por favor, insira o CPF do cliente."; } elseif(!ctype_digit($input_cpfclient)){ $cpfclient_err = "Por favor, coloque apenas números do CPF."; } else{ $cpfclient = $input_cpfclient; } $input_gender = trim($_POST["gender"]); if(empty($input_gender)){ $gender_err = "Por favor, escolha o gênero do cliente."; } else{ $gender = $input_gender; } $input_phone = trim($_POST["phone"]); if(empty($input_phone)){ $phone_err = "Por favor, insira o telefone do cliente."; } elseif(!ctype_digit($input_phone)){ $phone_err = "Por favor, é necessário inserir o telefone de contato do cliente."; } else{ $phone = $input_phone; } $input_email = trim($_POST["email"]); if(empty($input_email)){ $email_err = "Por favor, insira o e-mail do cliente."; } else{ $email = $input_email; } $input_dayagend = trim($_POST["dayagend"]); if(empty($input_dayagend)){ $dayagend_err = "Por favor, coloque a data do atendimento do cliente."; } elseif(!ctype_digit($input_dayagend)){ $dayagend_err = "Por favor, é necessário uma data de atendimento para o cliente."; } else{ $dayagend = $input_dayagend; } $input_houragend = trim($_POST["houragend"]); if(empty($input_houragend)){ $houragend_err = "Por favor, coloque a data do atendimento do cliente."; } elseif(!ctype_digit($input_houragend)){ $houragend_err = "Por favor, é necessário uma data de atendimento para o cliente."; } else{ $houragend = $input_houragend; } if(empty($idclient) && empty($fullname_err) && empty($cpfclient_err)&& empty($gender_err)&& empty($phone_err)&& empty($email_err)&& empty($dayagend_err)&& empty($houragend_err)){ $sql = "INSERT INTO schedule (idclient, fullname, cpfclient, gender, phone, email, dayagend, houragend) VALUES (?, ?, ?)"; if($stmt = mysqli_prepare($link, $sql)){ mysqli_stmt_bind_param($stmt, "sss", $param_idclient, $param_fullname, $param_cpfclient, $param_gender, $param_phone, $param_email, $param_dayagend, $param_houragend); $param_idclient = $idclient; $param_fullname = $fullname; $param_cpfclient = $cpfclient; $param_gender = $gender; $param_phone = $phone; $param_email = $email; $param_dayagend = $dayagend; $param_houragend = $houragend; if(mysqli_stmt_execute($stmt)){ header("location: index.php"); exit(); } else{ echo "Ops! Algo deu errado. Por favor, tente novamente mais tarde."; } } if($stmt = mysqli_prepare($link, $sql)){ // [...] mysqli_stmt_close($stmt); } } mysqli_close($link); } ?> <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="UTF-8"> <title>Agenda dos Clientes</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> <style> .wrapper{ width: 600px; margin: 0 auto; } </style> </head> <body> <div class="wrapper"> <div class="container-fluid"> <div class="row"> <div class="col-md-12"> <h2 class="mt-5">Cadastro do Cliente</h2> <p>Por favor, preencha os campos abaixos para agendar o cliente.</p> <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post"> <div class="form-group"> <label>ID DO CLIENTE</label> <input type="text" name="idclient" class="form-control <?php echo (!empty($idclient_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $idclient; ?>"> <span class="invalid-feedback"><?php echo $idclient_err;?></span> </div> <div class="form-group"> <label>NOME COMPLETO</label> <input type="text" name="fullname" class="form-control <?php echo (!empty($fullname_err)) ? 'is-invalid' : ''; ?>"><?php echo $fullname; ?> <span class="invalid-feedback"><?php echo $fullname_err;?></span> </div> <div class="form-group"> <label>CPF</label> <input type="text" name="cpfclient" class="form-control <?php echo (!empty($cpfclient_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $cpfclient; ?>"> <span class="invalid-feedback"><?php echo $cpfclient_err;?></span> </div> <div class="form-group"> <label>GÊNERO</label> <input type="text" name="gender" class="form-control <?php echo (!empty($gender_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $gender; ?>"> <span class="invalid-feedback"><?php echo $gender_err;?></span> </div> <div class="form-group"> <label>Telefone</label> <input type="text" name="phone" class="form-control <?php echo (!empty($phone_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $phone; ?>"> <span class="invalid-feedback"><?php echo $phone_err;?></span> </div> <div class="form-group"> <label>E-mail</label> <input type="text" name="email" class="form-control <?php echo (!empty($email_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $email; ?>"> <span class="invalid-feedback"><?php echo $email_err;?></span> </div> <div class="form-group"> <label>Agendar Dia</label> <input type="text" name="dayagend" class="form-control <?php echo (!empty($dayagend_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $dayagend; ?>"> <span class="invalid-feedback"><?php echo $dayagend_err;?></span> </div> <div class="form-group"> <label>Agendar Horário</label> <input type="text" name="houragend" class="form-control <?php echo (!empty($houragend_err)) ? 'is-invalid' : ''; ?>" value="<?php echo $houragend; ?>"> <span class="invalid-feedback"><?php echo $houragend_err;?></span> </div> <input type="submit" class="btn btn-primary" value="Submit"> <a href="index.php" class="btn btn-secondary ml-2">Cancel</a> </form> </div> </div> </div> </div> </body> </html>

Sou iniciante em C#, comecei a aprender a programar por essa linguagem, gostaria de entender como eu faço uma codificação que após minha tela de um programa inicial abrir, 5 segundos depois, abre o segundo form (segunda tela) (sem ter que utilizar botões). Por exemplo, a abertura do Visual Studio 2022.

Alguém pode da uma ajuda para desenvolver um grid conforme a imagem, de 3 colunas e 6 items em cada coluna com pop up? Que seja responsivo? Tipo o anexo no topico, onde o oloca verde fica a imagem e a descrição alinhada a direita, e ao clicar no item, abre uma janela onde posso mostrar mais informações?