Jump to content
Fórum Script Brasil

Search the Community

Showing results for tags 'css'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Programação & Desenvolvimento
    • ASP
    • PHP
    • .NET
    • Java
    • C, C++
    • Delphi, Kylix
    • Lógica de Programação
    • Mobile
    • Visual Basic
    • Outras Linguagens de Programação
  • WEB
    • HTML, XHTML, CSS
    • Ajax, JavaScript, XML, DOM
    • Editores
  • Arte & Design
    • Corel Draw
    • Fireworks
    • Flash & ActionScript
    • Photoshop
    • Outros Programas de Arte e Design
  • Sistemas Operacionais
    • Microsoft Windows
    • GNU/Linux
    • Outros Sistemas Operacionais
  • Softwares, Hardwares e Redes
    • Microsoft Office
    • Softwares Livres
    • Outros Softwares
    • Hardware
    • Redes
  • Banco de Dados
    • Access
    • MySQL
    • PostgreSQL
    • SQL Server
    • Demais Bancos
  • Segurança e Malwares
    • Segurança
    • Remoção De Malwares
  • Empregos
    • Vagas Efetivas
    • Vagas para Estágios
    • Oportunidades para Freelances
  • Negócios & Oportunidades
    • Classificados & Serviços
    • Eventos
  • Geral
    • Avaliações de Trabalhos
    • Links
    • Outros Assuntos
    • Entretenimento
  • Script Brasil
    • Novidades e Anúncios Script Brasil
    • Mercado Livre / Mercado Sócios
    • Sugestões e Críticas
    • Apresentações

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests

  1. Boa tarde pessoal, gostaria de pedir uma ajuda para criar um evento em um formulário HTML. Eu tenho um formulário em HTML e PHP, e nele tem um campo do tipo select e um campo do tipo text(desabilitado). Gostaria que ao clicar no campo select e escolher qualquer opção da lista, automaticamente em seguida aparecesse dentro do campo text um valor respectivo a opção escolhida anteriormente. Exemplo: Tenho um campo select com tipos diferentes de materiais (vidro, papel, alumínio, etc.) e no campo text(desabilitado) terei a quantidade de anos que cada material demora a se decompor na natureza. O campo text inicialmente estará vazio, mas quando selecionar o material, aparecerá dentro deste text a quantidade de anos. obs.: Os valores do campo select e do campo text estão ambos na mesma tabela do banco de dados(MySQL), o campo select com valores string e o campo text com valores inteiros. Não sei se consegui explicar direito, mas acredito que terei que utilizar javascript para este evento, mas ainda não sei como. Alguém tem ideia de como eu poderia fazer isso ou alguma dica? Muito obrigada!! 😁
  2. Bom dia, Alguém poderia me ajudar, estou precisando fazer um mapa clicavel em HTML5 + CSS ou em JavaScrip, o mapa e no estilo matriz [5x5] , que trocaria a cor na área selecionada, podendo selecionar até 3 locais com cores diferentes. Já procurei algo do tipo em vários lugares e não acho. Não consegui fazer, tentei utilizar hover no css e nada, alguém tem alguma sugestão? Já agradeço desde já.
  3. Estou criando um slide de vídeos (jwplayer) e sempre que eu retorno para o slide 1 e recomeço de novo, os players após o primeiro vídeo muda (ou seja, o player 2, 3, 4, 5 etc). Pra ficar mais fácil de entender, é só acessar esse exemplo: https://codepen.io/lucasramosart/pen/wvJVeGN Note que o slide 1 sempre se mantém igual mesmo após recomeçar inúmeras vezes. Neste trecho do código script, quando eu altero o display para "inline-block", por exemplo, todos os players permanecem iguais mesmo ao recomeçar várias vezes, porém, os slides ficam desalinhados e o contador (1/6) fica bugado. for (i = 0; i < slides.length; i++) { slides[i].style.display = "none"; } Como posso resolver isso? Desde já agradeço!
  4. Galera, to compartilhando um curso mega útil. Em uma página web moderna pode conter diversas imagens e muitas vezes essas nem chegam a ser vistas pelo usuário, pois o mesmo pode clicar em um link e já navegar para outro conteúdo, não é verdade? No desenvolvimento de uma aplicação web, por exemplo, acabamos carregando todas as imagens mesmo sem necessidade, o que atrapalha e muito o tempo de carregamento e aumenta o consumo de banda desnecessariamente. Existe uma técnica chamada Lazy Load que resolve exatamente esse problema, ou seja, as imagens são carregadas apenas quando aparecem na área visível do navegador. https://preview.ibb.co/kEwDOH/curso_lazy_load_1.png https://preview.ibb.co/jOiciH/curso_lazy_load_2.png Se liga aqui para ver os cursos, completos e grátis:https://youtu.be/86wxusfp000 https://youtu.be/IKznPWVgDKg https://youtu.be/8JW2kH4spk0 https://youtu.be/NWE_2Sz7cjg https://youtu.be/R3ZwASzR0m8 https://youtu.be/BBqD-oJTg7s
  5. Boas pessoal, estou encontrando dificuldades para achar uma adaptação ao meu código de slider. Tudo funciona bem. Mas quando eu tento reduzir o tamanho do browser, a UL do Slider continuar com a mesma medida porque estou resgatando ela via JS. Preciso de ajuda para converter em CSS. CSS: @import url('https://fonts.googleapis.com/css2?family=Montserrat:[email protected]&display=swap'); * { font-family: Montserrat; margin: 0; padding: 0; border: none; outline: none; transition: all 1s ease; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } :root { --widthContainer: 80vw; } ul { list-style: none; } div.slider { position: relative; display: flex; justify-content: center; align-items: center; width: 100vw; background: #000; } div.slider div.container { position: relative; width: var(--widthContainer); overflow: hidden; } div.slider div.container ul { position: relative; display: inline-flex; } div.slider div.container ul li { position: relative; width: var(--widthContainer); } div.slider div.container ul li img{ width: 100%; } div.slider div.container label { position: absolute; opacity: 0; width: 100px; height: 50px; left: calc( 50% - 50px ); top: calc( 50% - 25px ); z-index:2; color: #fff; } div.slider div.container button { position: absolute; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; top: calc( 50% - 25px ); background: none; border-radius: 50%; z-index:2; color: #fff; font-size: 2em; } div.slider div.container button:hover { cursor: pointer; background: #999; } div.slider div.container button#back { left: 10px; } div.slider div.container button#front { right: 10px; } div.slider div.container ul li span { position: absolute; display: flex; font-size: 2.5vw; top: 0; left: 0; color: #fff; background: rgba(0,0,0, .3); padding: 10px; width: 100%; } div.slider div.container ul li span:hover { background: #999; cursor:pointer; } .ulToRight { left: calc(left - var(--widthContainer) ); } .ulToLeft { left: calc(left + var(--widthContainer)); } @media screen and (min-width: 0px) and (max-width:800px) { :root { --widthContainer: 100vw; } } HTML: <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> <div class="slider"> <div class="container"> <label>Pausado</label> <button id="back"><</button> <ul> <li class="item"> <span>F540 2 BAN PNEU 1.1 X 1.80 R$ 25.800</span> <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.1 X 1.80 R$ 25.800.png"> </li> <li class="item"> <span>F540 2 BAN PNEU 1.1 X 1.60 R$ 24.300</span> <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.1 X 1.60 R$ 24.300.png"> </li> <li class="item"> <span>F540 2 BAN PNEU 1.1 X 2.00 R$ 27.300</span> <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.1 X 2.00 R$ 27.300.png"> </li> <li class="item"> <span>F540 2 BAN PNEU 1.3 X 2.00 R$ 28.800</span> <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.3 X 2.00 R$ 28.800.png"> </li> <li class="item"> <span>F540 2 BAN PNEU 1.5 X 2.00 R$ 30.300</span> <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.5 X 2.00 R$ 30.300.png"> </li> </ul> <button id="front">></button> </div> </div> JS: $(document).ready(function(){ container = $("div.slider div.container"); containerWidth = $(container).width(); ul = $("div.slider div.container ul"); left = $(ul).offset().left; lis = $("div.slider div.container ul li"); label = $(container).find("label"); back = $(container).find("button#back"); front = $(container).find("button#front"); back.on("click", function() { label.css("opacity", 0); //ul.addClass("ulToLeft").removeClass("ulToRight"); left += containerWidth; if ( Math.round(left) >= containerWidth ) { left = ( ( lis.length - 1 ) * -containerWidth ) + container.offset().left; } ul.offset({left:Math.round(left)}); }) front.on("click", function() { label.css("opacity", 0); //ul.addClass("ulToRight").removeClass("ulToLeft"); left -= containerWidth; if ( Math.round(left) <= -((lis.length - 1) * containerWidth) ) { left = container.offset().left; } ul.offset({left:Math.round(left)}); }) front.trigger( "click" ); function intervalo () { front.trigger( "click" ); } var interval = setInterval(intervalo,4000); $(container).on("mouseover", function(){ clearInterval(interval); label.css("opacity", 1); }).mouseout(function(){ label.css("opacity", 0); interval = setInterval(intervalo,4000); }); }) Pode ser testado em https://codepen.io/carcleo/pen/yLVOxMv O problema é que não encontrando uma forma de, ao reduzir manualmente o tamanho da janela (navegador), fazer com que o tamanho da UL acompanhe os 80% da VW. Ele acaba mantendo os 80 da vw da primeira vez que a janela é aberta. Fiz uma tentativa com addClass do JQUERY mas não deu muito certo!
  6. Não estou conseguindo atualizar os dados da minha tabela já tentei de tudo mais não vai se vôces puderem dar uma olhada e me falar no que errei agradeço Código Consulta: <html> <head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/css/materialize.min.css"> <link rel="stylesheet" href="css/consulta.css"/> <link rel="stylesheet" href="css/style.css"/> <meta charset="UTF-8"/> <title> Resultado Da Pesquisa </title> <style> body{ color: #000; } </style> </head> <body> <div class="conteudo"> <?php //Criando tabela e cabeçalho de dados: echo "<table class = bordered striped centered highlight responsive-table>"; echo "<thead>"; echo "<tr>"; echo "<th><font color='#F60'>Matricula</font></th>"; echo "<th><font color='#F60'>Nome</font></th>"; echo "<th><font color='#F60'>Email</font></th>"; echo "<th><font color='#F60'>Data De Nascimento</font></th>"; echo "<th><font color='#F60'>Telefone</font></th>"; echo "<th><font color='#F60'>Curso</font></th>"; echo "</tr>"; echo "</thead>"; //Conectando ao banco de dados $StringConexao = mysqli_connect('localhost','root','','BD_TrioFelipeCaioKristhyan') or die("Erro ao conectar ao BD_TrioFelipeCaioKristhyan"); $sql = "SELECT * FROM TbCadastro"; $resultado = mysqli_query($StringConexao, $sql) or die("Erro ao encontrar a tabela TbCadastro"); //Obtendo os dados por meio de um loop while while ($registro = mysqli_fetch_array($resultado)) { $matricula = $registro['matricula']; $nomeAluno = $registro['nome']; $email = $registro['email']; $nascimento = $registro['nascimento']; $telefone = $registro['telefone']; $curso = $registro['curso']; echo "<tr>"; echo "<td>".$matricula."</td>"; echo "<td>".$nomeAluno."</td>"; echo "<td>".$email."</td>"; echo "<td>".$nascimento."</td>"; echo "<td>".$telefone."</td>"; echo "<td>".$curso."</td>"; echo "<td><a href=Deletar.php?matricula=".$matricula."><button class=btn_tabela> Deletar </button></a></td>"; echo "<td><a href=Atualizar.php?matricula=".$matricula."><button class=btn_tabela> Atualizar </button></a></td>"; } mysqli_close($StringConexao); echo "</table>"; ?> <br> <main> <center> <a href="Cadastrar.php" class="botao">Voltar</a> <center> </main> </div> </body> </html> Código Atualizar: <html> <head> <link rel="stylesheet" href="css/estilos.css"/> <link rel="stylesheet" href="css/style.css"/> <meta charset="UTF-8"/> <title> Trabalhando Com Conexão Ao Banco De Dados Felipe Vieira, Caio Leonardo e Kristhyan Carvalho </title> <?php $matricula = filter_input(INPUT_GET,"matricula"); $nome = filter_input(INPUT_GET,"nome"); $email = filter_input(INPUT_GET,"email"); $nascimento = filter_input(INPUT_GET,"nascimento"); $telefone = filter_input(INPUT_GET,"telefone"); $curso = filter_input(INPUT_GET,"curso"); ?> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery.maskedinput/1.4.1/jquery.maskedinput.min.js"></script> <style> body{ color: #000; } </style> </head> <body> <div class="conteudo"> <h3><b> <span style="color: #F60;">Atualizar Cadastro</span> </b></h3> <form action = "Alterar.php"> Matricula: <input type = "text" name = "Matri" size = "10" value = "<?php echo $matricula ?>"><br><br> Nome: <input type = "text" name = "NomeAluno" size = "45" value = "<?php echo $nome ?>"><br><br> Email: <input type = "email" name = "Email" size="45" value = "<?php echo $email ?>"><br><br> Data De Nascimento: <input type = "date" placeholder = "DD/MM/AAAA" name = "nascimento" value = "<?php echo $nascimento ?>"><br><br> Telefone: <input type = "text" maxlength = "15" id="telefone" name = "Telefone" value = "<?php echo $telefone ?>"><br><br> Curso: <select name="Curso"> <option value = "DS">Desenvolvimento De Sistemas</option> <option value = "ADM">Administração</option> <option value = "NUTRI">Nutrição</option> <option value = "RH">Recursos Humanos</option> <option value = "QUÍM">Química</option> </select> <main> <input type = "submit" name = "enviar" class="botao" value = "Enviar"> <a href="Consulta.php" class="botao">Voltar</a> </main> <!-- <input type = "submit" name = "enviar" value = "Enviar"> --> <script> $(document).ready(function(){ $("#telefone").mask("(99) 99999-9999"); }); </script> </form> </div> </body> </html> Código Alterar: <?php $matricula = filter_input(INPUT_GET, "matricula"); $nome = filter_input(INPUT_GET, "nome"); $email = filter_input(INPUT_GET, "email"); $nascimento = filter_input(INPUT_GET, "nascimento"); $telefone = filter_input(INPUT_GET, "telefone"); $curso = filter_input(INPUT_GET, "curso"); $StringConexao = mysqli_connect('localhost','root','','BD_TrioFelipeCaioKristhyan'); if($StringConexao){ $query = mysqli_query($StringConexao, "update TbCadastro set nome='$nome', email='$email', nascimento='$nascimento', telefone='$telefone', curso='$curso' where matricula='$matricula';"); if($query){ header("Location: Cadastrar.php"); }else{ die("Erro: ".mysqli_error($StringConexao)); } }else{ die("Erro: ".mysql_error($StringConexao)); } ?>
  7. Bom dia! Faz tempo que eu procuro mais não encontro um código CSS para mudar a cor do menu principal do meu site wordpress de acordo com a rolagem. Por exemplo, o código que eu tenho muda a cor do menu quando a pessoa rola a página para baixo e quando ela volta para cima ele fica na cor original. Porém o menu quando rolado fica somente com uma cor, eu precisaria que de acordo com a parte que a pessoa esta no site ele fique com uma cor diferente. Esse é o código que eu tenho: div#top-bar-wrap { display: none!important; } #header.elementor-sticky--effects { background-color: #000000d7; transition: all .5s ease; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); } #header.elementor-sticky--effects .logo img { content:url('link da logo principal do site'); } #header.elementor-sticky--effects .menufixo li a { color: #fff!important; } #header.elementor-sticky--effects .menufixosecundario li a { color: #fff!important; } O que eu preciso é exatamente como nesse site: https://www.c6bank.com.br/ Reparem que o menu fixo muda de cor, de acordo com a parte que ele está no site. Desde já agradeço pela ajuda!
  8. Boa tarde, pessoal... Se puderem me ajudar eu agradeço muito! Não consigo linkar um código externo em CSS para o código HTML. Ambos estão na mesma pasta porém ele simplesmente mostra como se não tivesse nenhum código CSS. Código HTML: Código CSS: Agradeço desde já.
  9. Ola, Tudo bom? Gostaria de saber se alguém tem alguma ideia de como faco para deixar esses botoes de COMPRAR sempre ALINHADOS. Estou usando o Tema StoreFront, no WordPress. Em outros sites vi que normalmente os titulos quando excede um numero de caracteres (2 linhas), ele coloca os ' ... ' (tres pontinhos), que ai o titulo completo so ficaria visivel caso o cliente clicasse e fosse ver a pagina do produto. Esse botao de OFERTA, acho que vou ter que excluir ele de qualquer jeito pra se adequar melhor ao tema.
  10. eae galera, tudo certo? comigo não ;-; hoje eu tava tentando testar minha nova ideia para gerar público e eu "novato" tentei fazer uma página, só que quando eu terminei o table era pra ele ficar no topo da página só que de nenhum jeito consigo subir ele to quase pensando em desistir :(, se alguém souber me explica como deixa ele pregado no topo me ajudaria muito. <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"/> <meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport"> <title>Teste cliente Download</title> <link href="css/style.css" rel="stylesheet"/> <link href="//db.onlinewebfonts.com/c/952bab25f6798d6bb1937d67e9bee4dd?family=Sans" rel="stylesheet" type="text/css"/> <script src="scripts/seu-script.js"></script> </head> <body> <img src="https://w7.pngwing.com/path/219/256/932/phoenix-logo-clip-art-flame-football-pictures-daquan-39eaa91327b05025a67a93ad36571b53.png" alt="" width="80"> <br><br> <h3>Área de Download</h3> <h4>coloque seu email para prosseguir com o download<a href="obrigado.voce.que.esta.me.ajudando.❤️.html"> Saiba mais</a></h4> <br><br> <table class="content-table"> <thead> <tr> <th>Nome</th> <th>Canal</th> <th>Armazenamento</th> <th>Situação</th> </tr> </thead> <tbody> <tr> <td>arquivo.apk</td> <td>TesteGamer</td> <td>?Mb?</td> <td>pendente</td> </tr> </div> <form> <div class="inputBox"> <input type="email" name="usuario" id="usuario" required=""> <label>Email</label> </div> <div id="teste"> </div> <form> <input type="submit" name="próximo" value="próximo" class="botaoEnviar" /> </form> </body> </html> * { font-family: sans-serif,@import url(//db.onlinewebfonts.com/c/952bab25f6798d6bb1937d67e9bee4dd?family=Sans);; } .content-table { border-collapse: collapse; margin: 30px 0; font-size: 0.8em; min-width: 400px; border-radius: 5px 5px 0 0; overflow: hidden; box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); table-layout: fixed; } .content-table thead tr { background-color: #DC143C; color: #ffffff; text-align: center; font-weight: bold; table-layout: fixed; } .content-table th, .content-table td { padding: 12px 15px; table-layout: fixed; } .content-table tbody tr { border-bottom: 1px solid #dddddd; } .content-table tbody tr:nth-of-type(even) { background-color: #red; } .content-table tbody tr:last-of-type { border-bottom: 2px solid #red; } h3 { font-size: 45px; text-align: center; text-decoration: none; } h4 { font-size: 10px; color: #687173; text-align: center; text-decoration: none; font-weight: 500; } a { font-size: 10px; text-align: center; text-decoration: none; } .inputBox { position: relative; } .inputBox input { width: 80%; padding: 10px 0; font-size: 16px; color: #000; letter-spacing: 0.3px; margin-bottom: 30px; border: none; border-bottom: 1px solid #0070BA; outline: none; background: transparent; } .inputBox label { position: absolute; top: 0; left: 0; padding: 2px 0; font-size: 14px; color: #0070BA; pointer-events: none; transition: .5s; } .inputBox input:focus ~ label, .inputBox input:valid ~ label { top: -18px; left: 0; color: #000; font-size: 12px; } form { display: flex; align-items: center; justify-content: center; flex-direction: column; min-height: 100vh; } .botaoEnviar { width: 150px; padding: 10px 13px; border: 1px solid #000; border-radius: 30px; background-color: #DC143C; font-weight: bold; color: #fff; font-size: 18px; } }
  11. Boa tarde pessoa, para me facilitar meu trabalho estou tentando criar um sistema para preencher automaticamente uns documentos, mais para isso quero criar uma tela de login responsivo, para todos os formatos, até ai tudo bem. Três coisa não estou conseguindo fazer bem. Quando estou com o telemóvel em pé fica bem, quando viro-o fica desconfigurado. Onde estou a errar? E também a imagem do user e Background não fica correctamente, terei que usar média Queries para cada formato? deixo imagem abaixo imagens do tablet, computador e celular. Índex.php <!DOCTYPE html> <html lang="pt-pt"> <head> <meta charset="UTF-8"> <title>Preenchimento de Documentos</title> <link rel="stylesheet" href="css/estilo.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> </head> <body> <header> <div class="formulario"> <h1>Login</br><small> versão 1.0</small></h1> <div class="img-user"> <img src='imgs/img-user.png'> </div> <h2>Autenticação do Sistema</h2> <form> <div class="campo"> <input type=text required=""> <label>email</label> </div> <div class="campo"> <input type=password required=""> <label>Password</label> </div> <input type="checkbox" checked="checked" class="checkbox"> <label class= "checkbox2">guardar dados</label></br></br> <button>Entrar</button> <p id="registo">Registar</p> </form> </div> </header> </body> </html> Estilo.css @charset "UTF-8"; *{ padding: 0; margin: 0; box-sizing: border-box; font-family: arial; } body{ width: 100%; height: auto; } header{ height: 100vh; width: 100%; background: url('../imgs/bg.gif'); background-repeat: no-repeat; background-size: cover; display: flex; justify-content: center; align-items:center; user-select:none; } .img-user{ width:100px; height:100px; left:0; right:0; margin:auto; top: 18%; position: absolute; background:#fff; border-radius:50%; display:flex; justify-content: center; } .img-user img{ width:80%; } h1{ margin-top: 50px; text-align:center; font-size:2rem; } h1 small{ font-size: 1rem; color:gray; } h2{ text-align:center; margin: 20px; } header .campo input{ width:90%; padding:10px; font-size:17px; background: transparent; border:none; border-bottom: solid 1px black; letter-spacing:2px; outline:none; margin:20px; } .formulario{ height: 550px; padding: 20px; background: rgba(255,255,255,0.5); border-radius:40px 10px 40px 10px; box-shadow: 0 20px 20px; } header .campo{ position: relative; } header .campo label{ position:absolute; top:0; left:0; padding: 10px; margin-left: 10px; font-size:16px; pointer-events: none; } header .campo input:focus~label, header .campo input:valid~label{ top:-20px; transition:0.5s; font-size:10px; } .checkbox2{ font-size: 13px; } header button{ width:100%; height:40px; border:none; outline:none; background: linear-gradient(to right, #505050, #909090); color: #fff; padding:10px 20px; font-size:15px; cursor:pointer; border-radius: 4px; } #registo{ margin-top: 20px; font-weight:bold; text-align:center; cursor:pointer; }
  12. Preciso fazer um trabalho para a escola e queria fazer um sistema de mensagem quando passa o mouse tipo o desse site ai https://www.todamateria.com.br/tabela-periodica/ se poderem me ajudar ficaria muito grato
  13. Boa noite pessoal. Estou começando agora no HTML e CSS, estou com uma dificuldade de posicionar meus menus. tentei de varias formas mas ainda não consegui fazer do jeito certo. Creio ter feito varias gambiarras, para chegar nesse resultado. Mas o menu da direita não consigo de jeito nenhuma deixar alinhado com o da esquerda. Acredito que me falta um pouco de experiencia no posicionamento de componentes. Já estudei bastante, mas não encontrei saida. Pretendo fazer dois sidebar sendo acionados e retraidos pelos botoes de "3barras" de um lado e de outro. Segue a segunda foto como o objetivo em que gostaria de chegar. Segue tambem o código em meu github. https://github.com/DevJMoab/WebWorld Agradeceria muito pela ajuda.
  14. Olá, estou com uma dificuldade para posicionar um elemento. Se trata de um pop-up que aparece na tela ao clicar. Acontece que esse pop-up não fica centralizado em todas as telas dependendo da resolução. No momento estou usando o position absolute, conforme abaixo: .form-structor { background-color: #222; border-radius: 15px; height: 550px; width: 450px; position: absolute; top: -100px; left: 170px; overflow: hidden; } Também já tentei: {position: relative; top: 50%; left: 50%;} Alguém pode me ajudar? Qual propriedade eu utilizo para ficar centralizado tanto horizontal e quanto vertical em qualquer resolução?
  15. Galera, alguém poderia me ajudar? Estou querendo alinhar essas 4 imagens, títulos e respectivas legendas uma ao lado da outra, porém, as legendas da 3 e 4 imagens são diferentes das outras, o que acaba afetando a formatação, porém, quero que as imagens, texto... fiquem alinhados corretamente independente do tamanho do conteúdo que eu legendar. HTML <section id="sec"> <div id="basicInformations"> <figure id="laptopLogo"> <img src="Layouts/logos/outLaptop.png" /> <p class="titleImg">Web Design</p> <p id="pLaptop"> At vero eos et accusamus dignissimos ducimus <br> qui blanditiis praesentium atque corrupti <br> quas molestiasexcepturi <br> sint occaecati<br> </p> </figure> <figure id="magnifyingGlassLogo"> <img src="Layouts/logos/outMagnifyngGlass.png"/> <p class="titleImg">All Suport</p> <p id="pMGlass"> Nam libero tempore, cum soluta nobis est eligendi optio <br> cumque nihil impedit quo minus id quod maxime placeat facere <br> possimus, omnis voluptas assumenda est, <br> omnis dolor <br> </p> </figure> <figure id="shoppingCartLogo"> <img src="Layouts/logos/shoppingCart.png"/> <p class="titleImg">Best Price</p> <p id="pShoppingCart"> Itaque earum rerum hic tenetur a sapiente <br> delectus, ut aut reiciendis voluptatibus maiores alias <br> consequatur aut perferendis doloribus <br> so blinded by desire, that they cannot foresee <br> asperiores repellat. <br> </p> </figure> <figure id="facebookLogo" > <img src="Layouts/logos/finger.png"/> <p class="titleImg">Follow Us</p> <p id="pFinger"> On the other hand, we denounce with righteous indignation <br> and dislike men who are so beguiled and demoralized by the charms <br> of pleasure of the moment, so blinded by desire <br> </p> </figure> </div> CSS div#basicInformations{ background-color: white; left: 40px; } div#basicInformations figure{ display: inline-block; } div#basicInformations p{ font-size:11px; text-align: center; color: #acacac; margin-left: 5px; } div#basicInformations .titleImg{ text-align: center; color: #454545; font-size: 25px; font-weight: bold; margin-left: 5px; height: 100%; } div#basicInformations figure img{ position: relative; width: 200px; height: 200px; margin: 5px; } Galera, como voces podem notar na imagem, a 3 logo está mais acima e a 4 mais a baixo;
  16. Olá!! Pra que vocês entendam: Eu tenho um projeto HTML, e gostaria de inserir algumas estruturas de outro projeto dentro dela. Realizo então a inserção das estruturas do projeto 2 no <body> do projeto 1, e em seguida chamo no <head> as folhas CSS desse outro projeto. Bem lógico mas naturalmente desconfigura meu layout pois algumas classe dessas duas folhas de estilo se misturam. Daí, a solução também lógica e já instruída em outros fóruns: pega as classes e demais estruturas CSS desses trechos que você quer exportar do projeto 2 e coloca no CSS do projeto 1. Simples. No entanto está impossível encontrar as classes declaradas nos estilos dos elementos do projeto 2. Trechos delas não encontro no CSS e outros são confuso de entender. Teria que refazer todo o CSS do projeto 2 para entender onde estão as classes que quero copiar para o projeto 1. Por isso, minha pergunta: Existe alguma forma de facilitar esse trabalho? Alguma ferramenta que localize as classes de estilos de uma div, por exemplo, dentro do .CSS? Ou, ainda, alguma forma de utilizar a folha CSS do projeto 2 em determinado espaço do html do projeto 1?
  17. olá de Novo, Eu queria colocar me meu site, um carousel que mostre 4 imagens de inicio, e quando eu clicar pro lado, aparecer , mais 4. Lembrando que vai ficar no meio do site ! então tem que tomar essa propoção na imagem a baixo ! Meu site em HTML,CSS E JS. Quem puder me ajudar ! Grato !
  18. Olá, Tudo bem ? Estou com uma extrema dificuldade em fazer uma agenda para que o cliente faça login no site, entre e faça um agendamento ,com data,hora e o dia. E que eles sejam nulos para quando outro for fazer o cadastro. Quero que tenha um login de admin, para que o administrador entre e veja os horários marcados e com quem será. Fiz meu site com HTML e CSS. Alguém me ajuda a incluir esse formulário no meu site? Agradeço dês de já!
  19. Olá, eu estava mexendo em um Tema Wordpress, e no final do menu tem alguns ícones de social mídia que posso trocar selecionando em um biblioteca interna. Mas não tem o ícone do whatsapp para eu escolher Queria saber se tem alguma forma de trocar ícones assim no editor CSS colocando o Fontawesome no lugar por exemplo "<i class="fab fa-whatsapp"></i>" Obrigado!
  20. Fala galera, estou tentando o layout da imagem e estou com bastante dificuldades. Segue os códigos: HTML: <section id="about" class="about-area"> <div class="container"> <div class="row"> <div class="col-lg-12"> <div class="text-container"> <h1>Lorem ipsum dolor </h1> </div> <!-- end of text-container --> </div> <!-- end of col --> </div> <!-- end of row --> <div class="row"> <div class="col-lg-12"> <!-- Team Member --> <div class="team-member"> <div class="image-wrapper"> <img class="img-fluid" src="assets/images/team-member-2.svg" alt="alternative"> </div> <!-- end of image-wrapper --> <p class="p-large"><strong>Lacy Whitelong</strong></p> <p class="job-title">Business Developer</p> <span class="social-icons"> <span class="fa-stack"> <a href="#your-link"> <i class="fas fa-circle fa-stack-2x facebook"></i> <i class="fab fa-facebook-f fa-stack-1x"></i> </a> </span> <span class="fa-stack"> <a href="#your-link"> <i class="fas fa-circle fa-stack-2x twitter"></i> <i class="fab fa-twitter fa-stack-1x"></i> </a> </span> </span> <!-- end of social-icons --> </div> <!-- end of team-member --> <!-- end of team member --> <!-- Team Member --> <div class="team-member"> <div class="image-wrapper"> <img class="img-fluid" src="assets/images/team-member-2.svg" alt="alternative"> </div> <!-- end of image wrapper --> <p class="p-large"><strong>Chris Brown</strong></p> <p class="job-title">Online Marketer</p> <span class="social-icons"> <span class="fa-stack"> <a href="#your-link"> <i class="fas fa-circle fa-stack-2x facebook"></i> <i class="fab fa-facebook-f fa-stack-1x"></i> </a> </span> <span class="fa-stack"> <a href="#your-link"> <i class="fas fa-circle fa-stack-2x twitter"></i> <i class="fab fa-twitter fa-stack-1x"></i> </a> </span> </span> <!-- end of social-icons --> </div> <!-- end of team-member --> <!-- end of team member --> </div> <!-- end of col --> </div> <!-- end of row --> </div> <!-- end of container --> </div> <!-- container --> </section> CSS: /*=========================== 4.ABOUT css ===========================*/ .about-area { position: relative; background-color: #17171B; padding-top: 100px; padding-bottom: 100px; } .about-area .section-title .title { font-size: 44px; font-weight: 600; line-height: 55px; color: #121212; } @media (max-width: 767px) { .about-area .section-title .title { font-size: 22px; line-height: 32px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about-area .section-title .title { font-size: 28px; line-height: 38px; } } .about-area .section-title .text { font-size: 20px; line-height: 25px; color: #121212; margin-top: 8px; } @media (max-width: 767px) { .about-area .section-title .text { font-size: 16px; } } .single-about .about-icon img { width: 120px; } @media (max-width: 767px) { .single-about .about-icon img { width: 100px; } } .single-about .about-content { padding-left: 30px; } @media (max-width: 767px) { .single-about .about-content { padding-left: 0; padding-top: 30px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .single-about .about-content { padding-left: 30px; padding-top: 0; } } .single-about .about-content .about-title { font-size: 20px; font-weight: 600; line-height: 25px; color: #ffffff; } .single-about .about-content .text { font-size: 16px; color: #ffffff; margin-top: 16px; } /*===== ABOUT 2 =====*/ .about-area-2 { position: relative; padding-top: 120px; padding-bottom: 120px; } .about-area-2 .about-image { position: absolute; width: 40%; height: 100%; top: 0; right: 0; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .about-area-2 .about-image { width: 34%; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about-area-2 .about-image { position: relative; width: 720px; margin: 0 auto; } } @media (max-width: 767px) { .about-area-2 .about-image { position: relative; width: 100%; padding-left: 15px; padding-right: 16px; margin: 0 auto; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about-area-2 .about-image { position: relative; width: 540px; margin: 0 auto; } } .about-area-2 .about-image .image { max-width: 580px; width: 100%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .about-area-2 .about-image .image { margin: 0 auto; padding-top: 50px; } } @media (max-width: 767px) { .about-area-2 .about-image .image { margin: 0 auto; padding-top: 50px; } } .about-area-2 .about-image .image img { width: 100%; } .about-content-2 { position: relative; z-index: 9; } .about-content-2 .about-icon i { font-size: 64px; color: #ffffff; } .about-content-2 .about-content { padding-left: 15px; } @media (max-width: 767px) { .about-content-2 .about-content { padding-left: 0; padding-top: 15px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about-content-2 .about-content { padding-left: 15px; padding-top: 0; } } .about-content-2 .about-content .about-title { font-size: 24px; font-weight: 500; line-height: 30px; color: #ffffff; } .about-content-2 .about-content .text { font-size: 14px; line-height: 20px; color: #ffffff; margin-top: 8px; } /*===== ABOUT 3 =====*/ .about-area-3 { background-color: #17171B; padding-top: 50px; padding-bottom: 100px; } .about-area-3 .image { width: 100%; } .about-area-3 .about-content .sub-title { color: #ffffff; font-size: 24px; line-height: 30px; font-weight: 700; text-transform: uppercase; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .about-area-3 .about-content .sub-title { font-size: 20px; } } @media (max-width: 767px) { .about-area-3 .about-content .sub-title { font-size: 20px; } } .about-area-3 .about-content .about-title { font-size: 44px; font-weight: 500; line-height: 55px; color: #ffffff; margin-top: 16px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .about-area-3 .about-content .about-title { font-size: 38px; line-height: 45px; } } @media (max-width: 767px) { .about-area-3 .about-content .about-title { font-size: 32px; line-height: 35px; } } .about-area-3 .about-content .text { color: #ffffff; font-size: 20px; font-weight: 500; margin-top: 16px; line-height: 25px; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .about-area-3 .about-content .text { font-size: 18px; } } @media (max-width: 767px) { .about-area-3 .about-content .text { font-size: 16px; line-height: 24px; } } .about-area-3.about-area-bg-3 { background-color: #fff; } /* About */ .team-member { display: inline-block; width: 12.5rem; margin-right: 2rem; margin-left: 2rem; vertical-align: top; } /* end of about */ /* About */ .team-member { margin-right: 2.25rem; margin-left: 2.25rem; } /* end of about */ /*********************/ /* 14. About */ /*********************/ .basic-4 { padding-top: 7rem; padding-bottom: 4rem; text-align: center; } .basic-4 h2 { margin-bottom: 1rem; text-align: center; } .team-member { max-width: 12.5rem; margin-right: auto; margin-bottom: 3.5rem; margin-left: auto; } /* Hover Animation */ .image-wrapper { overflow: hidden; margin-bottom: 1.5rem; border-radius: 50%; } .image-wrapper img { margin: 0; transition: all 0.3s; } .image-wrapper:hover img { -moz-transform: scale(1.15); -webkit-transform: scale(1.15); transform: scale(1.15); } /* end of hover animation */ .team-member .p-large { margin-bottom: 0.25rem; font-size: 1.125rem; } .team-member .job-title { margin-bottom: 0.375rem; } .fa-stack { color: #ffffff; margin-top: 0.375rem; margin-right: 0.125rem; margin-left: 0.125rem; font-size: 1.25rem; } .fa-stack-2x { color: #ffffff; transition: all 0.2s ease; } .fa-stack-1x { color: #fff; transition: all 0.2s ease; } .fa-stack:hover .fa-stack-2x { color: #ffffff; } .fa-stack:hover .fa-stack-1x { color: #fff; }
  21. Boa noite; Gostaria de saber como procurar mecanismo corretos de varredura para esse código; OBS: Sou leigo e gostaria de começar a entender para criar meu próprio aplicativo de informações de licitação e futuramente lances. Por favor, me ajudem! Como posso entender essa linha de comando corretamente? <!DOCTYPE html> <html> <head> <meta http-equiv='X-UA-Compatible' content='IE=EmulateIE11'> <meta name="viewport" content="width=device-width"> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <base href='https://www.licitacoes-e.com.br/aop/lct/'> <title>www.licitacoes-e.com.br</title> <link href="../imagem/bbfav.ico" rel="SHORTCUT ICON" > <!-- <link href="../estilo/displaytag/displaytag-aop.css" rel="stylesheet" type="text/css"> --> <!-- <link href="../javascript/jquery/css/jquery-ui.css" rel="stylesheet" type="text/css"> --> <script src="../javascript/formatadadosie.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/jquery/jquery-1.9.0.min.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/jquery/jquery-ui-1.10.4.custom.min.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/elemsbot.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/jquery/jquery.dataTables.min.js" type="text/javascript" charset="ISO-8859-1" charset="utf-8"></script> <script src="../javascript/jquery/tabletools/TableTools.min.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/jquery/tabletools/ZeroClipboard.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/yav/yav.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/yav/yav-config-pt-BR.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/calendario/dateparse.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/calendario/ui.datepicker-pt-BR.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/calendario/ui.datepicker-aop.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/jquery/jquery.mask.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/jquery/jquery.validate.min.js" type="text/javascript" charset="utf-8"></script> <link href="../javascript/jquery/css/jquery-ui-1.8.23.custom.css" rel="stylesheet" type="text/css"> <link href="../estilo/ui-lightness/table_jui.css" rel="stylesheet" type="text/css"> <link href="../javascript/jquery/css/dataTables.tableTools.css" rel="stylesheet" type="text/css"> <link href="../estilo/reset.css" rel="stylesheet" type="text/css"> <link href="../estilo/elements.css" rel="stylesheet" type="text/css"> <link href="../estilo/grade.css" rel="stylesheet" type="text/css"> <link href="../estilo/layout.css" rel="stylesheet" type="text/css"> <link href="../estilo/dropdownmenu.css" rel="stylesheet" type="text/css"> <link href="../estilo/buttons.css" rel="stylesheet" type="text/css"> <link href="../estilo/msgs.css" rel="stylesheet" type="text/css"> <link href="../estilo/aop.css" rel="stylesheet" type="text/css"> <link href="../estilo/echat.css" rel="stylesheet" type="text/css"> <link href="../estilo/carregando.css" rel="stylesheet" type="text/css"> <script src="../javascript/msgs.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/jquery/jquery-ui-timepicker-addon.js" type="text/javascript" charset="utf-8"></script> <link href="../javascript/jquery/css/jquery-ui-timepicker-addon.css" rel="stylesheet" type="text/css"> <script src="../javascript/moment.min.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/moment-timezone-with-data.min.js" type="text/javascript" charset="utf-8"></script> <!-- ESTES SCRIPTS TRABLHAM JUNTOS --> <script src="../javascript/utils.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/inicializadores.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/link.js" type="text/javascript" charset="utf-8" charset="utf-8"></script> <script src="../javascript/aop.js" type="text/javascript" charset="utf-8"></script> <script src="../javascript/carregando.js" type="text/javascript" charset="utf-8"></script> <link href="../estilo/divpopupfull.css" rel="stylesheet" type="text/css"> <!-- Variaveis JS globais --> <script type="text/javascript"> var __sSwfPath = "https://www.licitacoes-e.com.br/aop/media/swf/copy_csv_xls_pdf.swf"; var __msgs = "https://www.licitacoes-e.com.br/aop/msgs.aop"; var __callbackOnSomenteRequisicao = function(){ mostrarMensagensErro(); } </script> <script type="text/javascript"> $(document).ready(function(){ inicializaScripts(); }); function inicializaScripts(){ mostrarMensagensErro(); inicializaToggleFieldset(); $(".disableAction").attr("onClick", "return false;").css({ opacity: 0.4}).hover(function (){}); inicializaMascaras(); inicializaContadorCaracteres(); inicializaDropdownMenu(); inicializaExtensoesDatatable(); inicializadorFocoInicial(); } </script> <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-86274540-1', 'auto'); ga('send', 'pageview'); </script> </head> <body id="bodyPrincipal"> <a name="topo"></a> <div class="msgs msg-center"> <ul> </ul> </div> <script type="text/javascript"> $(document).ready(function(){ showMsg(); }); function fecharMensagemErro(me){ escondeMsg(me); } </script> <!-- <div class="e-chat-div"> --> <!-- <div class="e-chat-close"> --> <!-- Tire suas dúvidas <img src="../imagem/chat-icon.png" /> --> <!-- </div> --> <!-- </div> --> <div align="center"> <div id="total" style="width: 100%; position: relative;" align="center"> <div id="cabecalho"> <div id="fundo_bg"> <div class="fundo_bg_esq">&nbsp;</div> <div class="fundo_bg_dir"> <div class="fundo_bg_separador">&nbsp;</div> </div> </div> <div id="cabecalho_topo"> <div id="cabecalho_topo_interno"> <div id="logo_bb" onclick="location.href='http://www.bb.com.br';">&nbsp;</div> <div class="cabecalho_topo_esq"> <div style="position: absolute; top: 2px; left: 90px; width: 550px;" > <p> <div style="padding-top: 5px;"> <a href="javascript:" onclick="abrirAcessoIdentificado();" >Acesso Identificado</a> <br/> <input placeholder="Chave de acesso" class="chaveJ input col" type="text" id="acessoChaveJ"> <a class="buttonAzul" value="ok" href="javascript:" onclick="abrirAcessoIdentificado();" >OK</a> </div> </p> </div> </div> <div class="cabecalho_topo_dir "> <div class="cabecalho_topo_dir_content"></div> <div style="position: absolute; top: 25px; left: 10px; width: 230px;"> <a href="http://www.bb.com.br/portalbb/home2,101,101,0,0,1,6.bb" target="_blank" style="font-size: 90%;"> Atendimento / SAC BB / Ouvidoria </a> </div> <div id="separador1" style="position: absolute; top: 10px; left: 220px;" class="cabecalho_topo_separador">&nbsp;</div> <!-- <div id="zooms" style="position: absolute; top: 10px; left: 230px; width: 200px;"> --> <!-- <a style="font-weight: bolder; margin-left: 7px; font-size:120%; height: 8px; line-height: 8px" href="javascript: " onclick="aumentaFonte();"> --> <!-- A --> <!-- </a> --> <!-- <a style="font-weight: bolder; margin-left: 10px; font-size:80%; height: 8px; line-height: 8px" href="javascript: " onclick="diminuiFonte();"> --> <!-- A --> <!-- </a> --> <!-- <a style="font-weight: bolder; margin-left: 12px; font-size:100%; height: 8px; line-height: 8px" href="javascript: " onclick="diminuiFonte();"> --> <!-- N --> <!-- </a> --> <!-- <br /> --> <!-- <a style="height: 8px; line-height: 8px; padding: 4px 6px 4px 6px;" class="button" href="javascript: " onclick="aumentaFonte();"> --> <!-- + --> <!-- </a> --> <!-- <a style="height: 8px; line-height: 8px; padding: 4px 6px 4px 6px;" class="button" href="javascript: " onclick="diminuiFonte();"> --> <!-- - --> <!-- </a> --> <!-- <a style="height: 8px; line-height: 8px; padding: 4px 6px 4px 6px;" class="button" href="javascript: " onclick="padraoFonte();"> --> <!-- = --> <!-- </a> --> <!-- </div> --> <div style="position: absolute; top: 10px; left: 380px;" class="cabecalho_topo_separador">&nbsp;</div> <div style="position: absolute; float:left; top: 20px; left: 390px; width: 200px;" > <div class="lingua_bandeira_brasil" onclick="javascript:document.fidiomaPT.submit();" style="float: left;">&nbsp;</div> <div class="lingua_bandeira_paraguai" onclick="javascript:document.fidiomaES.submit();" style="float: left;">&nbsp;</div> </div> </div> <form name="fidiomaPT" action="https://www.licitacoes-e.com.br/aop/" method="post" > <input type="hidden" name="br.com.bb.comercioeletronico.aop.tags.i18n.idioma" value="pt_BR"> <input type="hidden" name="index" value="true"> </form> <form name="fidiomaES" action="https://www.licitacoes-e.com.br/aop/" method="post" > <input type="hidden" name="br.com.bb.comercioeletronico.aop.tags.i18n.idioma" value="es_PY"> <input type="hidden" name="index" value="true"> </form> <script type="text/javascript"> $(document).ready(function(){ var url = "https://www.licitacoes-e.com.br/aop/login.aop?opcao=getDiferencaTempoServidorSistema"; Link.mostrar({ url: url, somenteRequisicao: true, success: function(data) { iniciarRelogio(data); } }); }); function aumentaFonte(){ var zoom = parseFloat($('body').css('zoom'), 10); zoom = zoom.toFixed(2); var novoZoom = parseFloat(zoom) + 0.03; $('body').css('zoom', novoZoom); $('#containerGeral').addClass('zoom1'); } function diminuiFonte(){ var zoom = parseFloat($('body').css('zoom'), 10); zoom = zoom.toFixed(2); var novoZoom = parseFloat(zoom) - 0.03; $('body').css('zoom', novoZoom); } function padraoFonte(){ $('body').css('zoom', 1); } $(document).ready(function(){ //Só aparece o zoom se for chrome if(!/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())){ $('#separador1').hide(); $('#zooms').hide(); } $('#acessoChaveJ').keypress(function(event) { if (event.keyCode == 13) { abrirAcessoIdentificado(); } }); }); </script> <script type="text/javascript"> function abrirAcessoIdentificado() { var chaveJ = $('#acessoChaveJ').val(); var link = '/aop/gcs/statics/login/login.bb?urlRetorno=2f696e6465782e6a7370'; link += '&chave=' + chaveJ; if (location.href.indexOf("https") == -1) { link = location.href .replace(/http/,"https") .replace(/(https:\/\/.*?)\/.*/g,"$1") + link; } location.href = link; } </script> </div> </div> <div id="cabecalho_menu"> <div id="cabecalho_menu_interno" style="text-align: center;"> <div class="menu"> <div class="menu_esq"></div> <div class="menu_dir"></div> <div class="menu_conteudo"> <ul> <li class="menu_seta_direita"> <a href="javascript:" onclick="Link.mostrar({url: 'https://www.licitacoes-e.com.br/multisalas/disputa/participarNovaSala.action', imprimir:false, largura:1180, altura:1500, iframe:true, titulo: '[www.licitacoes-e.com.br] - Sala de disputa', fecharAoClicarFora: false});" class="linksheader">Sala de disputa</a> </li> </ul> </div> </div> <div class="menu"> <div class="menu_esq"></div> <div class="menu_dir"></div> <div class="menu_conteudo"> <ul> <li class="menu_separador menu_seta_direita"> <a href='https://www.licitacoes-e.com.br/aop/pesquisar-licitacao.aop?opcao=preencherPesquisar' class="linksheader">Pesquisa avançada </a> </li> <li class="menu_seta_baixo"> <a href="javascript:" class="linksheader" onMouseOver="showDivMenu('acompanhandoLicitacoes')" onMouseOut="hideDivMenu('acompanhandoLicitacoes')">Acompanhando as licitações</a> </li> </ul> </div> </div> <div class="menu"> <div class="menu_esq"></div> <div class="menu_dir"></div> <div class="menu_conteudo"> <ul> <li class="menu_seta_direita"> <a href='https://www.licitacoes-e.com.br/bpe' class="linksheader" target="_blank">Banco de Preços</a> </li> </ul> </div> </div> <div class="menu"> <div class="menu_esq"></div> <div class="menu_dir"></div> <div class="menu_conteudo"> <ul> <li class="menu_seta_direita"> <a href="javascript:" onClick="Link.mostrar({url:'https://www.licitacoes-e.com.br/aop/lct/help/pt_br/help_geral2/help_indice.htm', largura:325, altura:550, iframe:true, titulo: 'Ajuda'});" class="linksheader">Ajuda </a> </li> </ul> </div> </div> <div id="acompanhandoLicitacoes" style="position: absolute; left: 376px; top: 28px; width: 166px; height: 101px; display: none;" onMouseOver="showDivMenu('acompanhandoLicitacoes')" onMouseOut="hideDivMenu('acompanhandoLicitacoes')" > <table width="200" align="right" border="0" cellspacing="0" cellpadding="3" class="menuPopup"> <tr> <td> <a href="javascript:fmSituacao(4);" class="linksheader">Publicadas</a> </td> </tr> <tr> <td> <a href="javascript:fmSituacao(5);" class="linksheader">Propostas abertas</a> </td> </tr> <tr> <td> <a href="javascript:fmSituacao(6);" class="linksheader">Em disputa </a> </td> </tr> <tr> <td> <a href="javascript:fmSituacao(7);" class="linksheader">Em homologação </a> </td> </tr> <tr> <td> <a href="javascript:fmSituacao(8);" class="linksheader">Concluídas </a> </td> </tr> </table> </div> <script type="text/javascript"> function hideDivMenu(menu){ document.getElementById(menu).style.display = "none"; } function showDivMenu(menu){ document.getElementById(menu).style.display = "block"; } </script> </div> </div> <div id="sub_cabecalho"> <div id="nome_site_licitacoes_div" class=""> <a class="nome_site_licitacoes" href="https://www.licitacoes-e.com.br/aop/">Licitações</a> <a id="nome_site_licitacoes_lupa" href="javascript:" class="icone_lupa nome_site_licitacoes_menu">Buscar</a> <div id="nome_site_licitacoes_menu" class="nome_site_licitacoes_menu"> <form onsubmit="return submeterPesquisaNumeroLicitacao(this);" name="pesquisarLicitacaoForm" action="https://www.licitacoes-e.com.br/aop/consultar-detalhes-licitacao.aop" method="GET"> <input type="hidden" name="opcao" value="consultarDetalhesLicitacao"> <label class="label col">Nº Licitação &nbsp; </label> <input id="numeroLicitacaoPopup" class="input input_merge_right col" type="text" name="numeroLicitacao" size="6" maxlength="9"> <a href="javascript:" onclick="$(this).closest('form').submit();" class="button button_merge_left col" style="padding-left: 5px; padding-right: 5px; ">Ok</a> </form> </div> </div> <script type="text/javascript"> $(document).ready(function(){ $(document).on('click', function(e) { var $clicked = $(e.target); if ($clicked.parents().hasClass("nome_site_licitacoes_menu") || $clicked.hasClass("nome_site_licitacoes_menu")){ $("#nome_site_licitacoes_menu").show('slide',{direction:'left'},200, function() { $("#numeroLicitacaoPopup").focus(); }); }else{ $("#nome_site_licitacoes_menu").hide('slide',{direction:'left'},200); } }); $("#nome_site_licitacoes_div").hover( function() { $("#nome_site_licitacoes_lupa").stop().fadeIn(800); }, function() { $("#nome_site_licitacoes_lupa").stop().fadeOut(200); } ); }); </script> <div id="nome_comprador_div"> </div> </div> </div> <div class="geral"> <div align="left" id="conteudo"> <br/> <br> <form name="fmSituacao" method="post" action="https://www.licitacoes-e.com.br/aop/listar-licitacoes-comprador.aop"> <input type="hidden" name="codigoTipoEstadoLicitacao" value=""> <input type="hidden" name="opcao" value="listarLicitacoesComprador"> </form> <script> function fmSituacao(codigoTipoEstadoLicitacao) { document.fmSituacao.codigoTipoEstadoLicitacao.value = codigoTipoEstadoLicitacao; document.fmSituacao.submit(); } </script> <hr class="br"> <!-- Lado esquerdo --> <div class="col20"> <table width="100%"> <tr> <td align="center"><img src='../imagem/homens_tit.gif'></td> <td><img src='../imagem/homens.jpg' width="183" height="116"></td> </tr> </table> <hr class="br" /> <div class="col40 tx_pg_inicial"> <br> <a href=https://www.licitacoes-e.com.br/aop/documentos/ORIENTACOESPREGAO.pdf target="_blank"> <img width="450" height="150" src="https://www.licitacoes-e.com.br/aop/documentos/BANNERNOVODECRETO.jpg"> </a> <br><br> <a href=https://www.licitacoes-e.com.br/aop/documentos/FORNECEDORPROPOSTA.pdf target="_blank"> <img width="450" height="150" src="https://www.licitacoes-e.com.br/aop/documentos/BANNERFORNECEDOR.jpg"> </a> <br><br> <a href=https://www.licitacoes-e.com.br/aop/documentos/CADASTRO.pdf target="_blank"> <img width="450" height="150" src="https://www.licitacoes-e.com.br/aop/documentos/BANNERCADASTRO.jpg"> </a> <br><br> Prezados usuários, <br><br> <p align="justify">Comunicamos a alteração dos telefones do Suporte Técnico. Os novos números são <b>4004-0001 - Capitais e Regiões Metropolitanas</b> e <b>0800-729-0001 - demais localidades</b>, escolhendo pela ordem as seguintes opções:</p> <br> <ul> <li>3 - empresa</li> <li>2 - orientações técnicas</li> <li>1 - correntista ou 2 não correntista</li> <li>7 - licitações</li> <ul> <br><br> Equipe Licitações-e </div> <hr class="br" /> </div> <!-- Lado direito --> <div class="col20"> <!-- Coluna Esquerda --> <div class="col20" > <!-- Regras do Jogo --> <fieldset class="col" style="width:90%; text-align: center;"> <a style="padding: 20px;" href="javascript: " onClick="Link.mostrar({url:'https://www.licitacoes-e.com.br/aop/lct/help/pt_br/site_intro/intro_lict_1.htm', largura: 600, altura: 530, iframe:true, titulo:'Introdução às regras do jogo'});"> <img src="../imagem/intro_regras.gif" border="0"> </a> </fieldset> <hr class="br" /> <!-- Certidões --> <fieldset class="col" style="width:90%; text-align: center;"> <h4>Certidões</h4> <ul class="lista_pg_inicial" style="text-align: left;"> <li> <a href="http://cnd.dataprev.gov.br/cws/contexto/cnd/cnd.html" target="_blank">INSS</a> </li> <li> <a href="https://webp.caixa.gov.br/cidadao/Crf/FgeCfSCriteriosPesquisa.asp" target="_blank">FGTS</a> </li> <li> <a href="http://idg.receita.fazenda.gov.br/orientacao/tributaria/certidoes-e-situacao-fiscal" target="_blank">Receita Federal e Dívida Ativa</a> </li> <li> <a href="http://www.sintegra.gov.br/" target="_blank">Inscrição Estadual</a> </li> <li> <a href="http://portal2.tcu.gov.br/portal/page/portal/TCU/comunidades/responsabilizacao/inidoneos" target="_blank">TCU - Responsabilização Pública</a> </li> <li> <a href="http://www.tst.jus.br/certidao/" target="_blank">Certidão Trabalhista</a> </li> </ul> <hr class="br" /> </fieldset> </div> <!-- Coluna Direita --> <div class="col20"> <fieldset class="col" style="width:90%; text-align: center;"> <!-- Painel resumo --> <h4>Todos Compradores</h4> <div style="min-height: 124px;" id="painel_resumo" align="center"></div> <br/> <hr width="100%"/> <!-- Outros compradores --> <a href="javascript: " onclick="Link.mostrar({url:'../listar-compradores.aop?opcao=pesquisarCompradores', largura:820, altura:500, iframe:false, titulo:'Pesquisar comprador'})"> <img src="../imagem/ver_todos_cmpr.gif" width='95' height='42' border='0'> </a> <hr width="100%"/> <!-- Todas as licitacoes --> <a href='https://www.licitacoes-e.com.br/aop/ index.jsp?codSite=0'> <img src="../imagem/ver_todas_licit.gif" border='0'> </a> <hr width="100%" /> <!-- Buscar licitacoes --> <form onsubmit="return submeterPesquisaNumeroLicitacao(this);" name="pesquisarLicitacaoForm" style="margin: 8px;" action="https://www.licitacoes-e.com.br/aop/consultar-detalhes-licitacao.aop" method="POST"> <input type="hidden" name="opcao" value="consultarDetalhesLicitacao"> <label class="label col">Nº Licitação &nbsp; </label> <input class="input input_merge_right col" type="text" name="numeroLicitacao" size="6" maxlength="9"> <a href="javascript:" onclick="$(this).closest('form').submit();" class="button button_merge_left col" style="padding-left: 5px; padding-right: 5px; ">Ok</a> </form> <hr class="br" /> </fieldset> </div> <hr class="br" /> <div class="col39"> <fieldset class="col39"> <h4>Links Úteis</h4> <table> <tr> <td align="left"> <ul class="lista_pg_inicial"> <li><a href="javascript: " onclick="Link.mostrar({url:'https://www.licitacoes-e.com.br/aop/lct/help/pt_br/regulamento/regulamento.pdf', largura:800, altura:900, iframe:true, titulo:'Regulamento'});">Regulamento do Licitações.</a></li> <li><a href="https://www.licitacoes-e.com.br/aop/solicitar-credenciamento.aop">Solicita&ccedil;&atilde;o de credenciamento no Licita&ccedil;&otilde;es-e.</a></li> </ul> <UL class='lista_pg_inicial'> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=16','Informação','scrollbars=yes , width=520 height=500')">Suporte Técnico </a></LI> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=14','Informação','scrollbars=yes , width=520 height=500')">Prêmios recebidos pelo Licitações-e </a></LI> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=13','Informação','scrollbars=yes , width=520 height=500')">Sala de Disputa </a></LI> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=11','Informação','scrollbars=yes , width=520 height=500')">Requisitos para utilização do Licitações-e </a></LI> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=8','Informação','scrollbars=yes , width=520 height=500')">Acórdão TCU 1.793/2011 - LC 123 art. 44 </a></LI> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=9','Informação','scrollbars=yes , width=520 height=500')">ICMS - Equalização </a></LI> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=7','Informação','scrollbars=yes , width=520 height=500')">Ressarcimento de custos </a></LI> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=6','Informação','scrollbars=yes , width=520 height=500')">Manuais Prorrogação Automática e RDC </a></LI> <LI><a href="javascript:void window.open('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=4','Informação','scrollbars=yes , width=520 height=500')">Banco de Preços </a></LI> </UL> </td> </tr> </table> </fieldset> <hr class="br" /> <!-- Suporte Tecnico --> <fieldset style="text-align: center;" class="col39" id="idTelSuporteTecnico"> <h2>Suporte Técnico</h2> <div style="width: 50%; float: left;"> <div style="font-size: 90%;">Capitais e Regiões Metropolitanas</div> <div style="font-weight: bolder;">4004 0001</div> </div> <div style="width: 50%; float: left;"> <div style="font-size: 90%;">Demais Localidades</div> <div style="font-weight: bolder;">0800 729 0001</div> </div> </fieldset> </div> <script> $(document).ready(function() { var rules0 = new Array(); rules0[0]='numeroLicitacao:o número da licitação|required'; rules0[1]='numeroLicitacao:o número da licitação|numeric|O valor informado deve ser númerico.'; rules0[2]='numeroLicitacao:o número da licitação|equal|0|pre-condition'; rules0[3]='numeroLicitacao|regexp|^\\d{0}$|post-condition'; rules0[4]='2|implies|3|Informe um valor maior que zero.'; var carregandoPainelResumo = new Carregando({local:'#painel_resumo'}); $.ajax({ type : 'post', url : '../painel-resumo-licitacao.aop', data : { opcao : 'consultar' }, beforeSend : function() { carregandoPainelResumo.mostrar(); }, success : function(resposta) { carregandoPainelResumo.esconder(); $('#painel_resumo').html(resposta); }, error : function(erro) { carregandoPainelResumo.esconder(); $('#painel_resumo').html(erro); } }); }); </script> </div> <hr class="br" /> <!-- baixo --> <div class="col40 push4 clear"> <a style="padding: 20px; " href="javascript: " onclick="link('https://www.licitacoes-e.com.br/aop/coringa.aop?opcao=paginaCoringa&numeroRegistro=1', {largura:520, altura:500, iframe:true, titulo:'Informação'})"> <img src="../imagem/botao_info.jpg" border="0"> </a> <a href="javascript: " onclick="link('https://www.licitacoes-e.com.br/aop/lct/bancomundial/bancomundial.jsp', {largura:500, altura:250, iframe:true, titulo:'Banco Mundial'})" style="padding: 20px;"> <img src="../imagem/bBancoMundial.gif" border="0"> </a> <a href="javascript: " onclick="link('https://www.licitacoes-e.com.br/aop/lct/bancointeramericano/bancointeramericano.jsp', {largura:500, altura:250, iframe:true, titulo:'Banco Internacional'})" style="padding: 20px;"> <img src="../imagem/bBancoInteramericano.gif" border="0"> </a> </div> <script> function MM_openBrWindow(theURL, winName, features) { window.open(theURL, winName, features); } function informacoesBancoMundial() { pagina = open("https://www.licitacoes-e.com.br/aop/lct/bancomundial/bancomundial.jsp","winLOV", "scrollbars=yes,resizable=yes,width=350,height=245"); if (pagina.opener == null) { pagina.opener = self; } } function informacoesBancoInteramericano() { pagina = open("https://www.licitacoes-e.com.br/aop/lct/bancointeramericano/bancointeramericano.jsp","winLOV", "scrollbars=yes,resizable=yes,width=350,height=245"); if (pagina.opener == null) { pagina.opener = self; } } function MM_reloadPage(init) { if (init == true) { with (navigator) { if ((appName == "Netscape") && (parseInt(appVersion) == 4)) { document.MM_pgW = innerWidth; document.MM_pgH = innerHeight; onresize = MM_reloadPage; } } } else if (innerWidth != document.MM_pgW || innerHeight != document.MM_pgH) { location.reload(); } } MM_reloadPage(true); </script> <script src="../javascript/elemsbot.js" type="text/javascript" charset="utf-8"></script> <div id="idChatbotVlz"> <div class="e-chat-closed" onclick="openCbWdw();"> <div class="e-chat-closed-int"> <span class="e-chat-font">Tire suas dúvidas</span> <img class="e-chat-icon" src="../imagem/chat-icon.png" /> </div> </div> <div class="e-chat-opened"> <div class="e-chat-opened-loading"> <img src="../imagem/carregando.gif" style="padding-top: 107%;"> </div> <div class="e-chat-bar-sup"> <span class="e-chat-font-open">Tire suas dúvidas</span> <span class="e-chat-btn-close" onclick="closeCbWdw()">X</span> </div> <div class="e-chat-bar-mid"> <ul id="ul-echat"></ul> </div> <div class="e-chat-bar-inf"> <textarea class="e-chat-txtarea" name="textAreaChat" rows="20" cols="40" id="mensagemUser" onkeypress="keypressioned(event, this)" placeholder="Digite sua dúvida a respeito do portal"></textarea> <img class="e-chat-send" src="../imagem/echat-send.png" onclick="contentAnalyze()" /> </div> </div> </div> <script type="text/javascript"> window.onload = function(){ habilitarChatbot('index'); } </script> </div> </div> </div> <!-- Footer --> <div id="rodape"> <div id="rodape_interno"> <div style="margin-left: 100px; color: #FFD900;" align="left">&copy; Banco do Brasil</div> <a href="http://www.bb.com.br/portalbb/page3,101,2388,0,0,1,1.bb?codigoMenu=229&codigoNoticia=13403&codigoRet=9093&bread=3" target="_blank">SAC BB - 0800 729 0722</a> | <a href="http://www.bb.com.br/portalbb/page3,101,2700,0,0,1,6.bb?codigoMenu=229&codigoNoticia=19412&codigoRet=457&bread=4" target="_blank">Ouvidoria - 0800 729 5678</a> | <a href="http://www.bb.com.br/portalbb/page3,101,2300,0,0,1,1.bb?codigoMenu=229&codigoNoticia=13753&codigoRet=9146&bread=6" target="_blank">Deficientes auditivos/fala - 0800 729 0088</a> | <a href="http://www.bb.com.br/portalbb/home2,105,105,0,0,1,6.bb" target="_blank">Segurança</a> | <a href="http://www.bb.com.br/portalbb/home2,136,136,0,0,1,8.bb" target="_blank">Relações com Investidores</a> <br /> <span style="margin-left: 100px; color: #999; font-size: 8px;" align="left"> pxl1aop00002_aop-14, 2020-02-19 17:58, Tue Mar 03 20:17:17 BRT 2020 </span> </div> </div> </div> <form name="consultarDetalhesLicitacaoForm" method="POST" id="consultarDetalhesLicitacaoForm" action="https://www.licitacoes-e.com.br/aop/consultar-detalhes-licitacao.aop"> <input type="hidden" name="numeroLicitacao" value=""> <input type="hidden" name="opcao" value="consultarDetalhesLicitacao"> </form> <script> function MM_reloadPage(init) { if (init==true) with (navigator) { if ((appName=="Netscape")&&(parseInt(appVersion)==4)) { document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; } } else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) { location.reload(); } } MM_reloadPage(true); function MM_openBrWindow(theURL,winName,features) { window.open(theURL,winName,features); } function alerta(){ frm = open("https://www.licitacoes-e.com.br/aop/lct/licitacao/publicacao/AlertaImport.jsp","winLOV", "scrollbars=yes,resizable=yes,width=300,height=190"); if (frm.opener == null){ frm.opener = self; } } function alertaAta(){ frm = open("https://www.licitacoes-e.com.br/aop/lct/licitacao/manutencao/AlertaAlteracaoAta.jsp","winLOV", "scrollbars=yes,resizable=yes,width=340,height=240"); if (frm.opener == null){ frm.opener = self; } } function MM_goToURL() { var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'"); } function detalhar(numeroLicitacao, novaJanela) { document.consultarDetalhesLicitacaoForm.numeroLicitacao.value = numeroLicitacao; novaJanela = typeof novaJanela !== 'undefined' ? novaJanela : false; if(novaJanela == true){ document.consultarDetalhesLicitacaoForm.target = "_blank"; }else{ document.consultarDetalhesLicitacaoForm.target = ""; } document.consultarDetalhesLicitacaoForm.submit(); } function acompanhamentoNovo(numeroLicitacao){ url = "https://www.licitacoes-e.com.br/acompanhamento/acompanhamento/acompanharNovo.action?numeroLicitacao=" + numeroLicitacao; Link.mostrar({url: url, cache: false, imprimir:false, largura:1300, altura:1500, iframe:true, titulo: 'Acompanhar disputa'}); } </script> </body> </html>
  22. Prezados, Depois de procurar uma solução e não conseguir resolver venho lhes pedir uma ajuda. Na página que estou trabalhando coloquei uma <div> que carrega um spinner em CSS. Para que o spinner não fique acionado coloquei no javascript uma função que desabilita. Ao chamar uma função do javascript eu coloquei um código que habilita o css novamente e quando termina a execução do código em javascript desabilita o css novamente. Essa lógica funciona bem no firefox, porém, não funciona no chrome e no IE. Não visualizei nenhum erro de semântica no console e um fato curioso é que se eu carregar a div direto sem solicitar que ela seja desabilitada pelo javascript o css carrega e funciona direito. Alguém, já passou por isso? Sabem me informar o motivo? Sem mais para o momento,
  23. Bom dia !! No site do link a seguir, quando eu reduzo o tamanho do site em: @media screen and (max-width: 900px) Entre a "Imagem 1" e a "tabela de baixo" existe um espaço !! Não estou conseguindo retirar este espaço !! LINK Por favor me ajudem Obrigado
  24. Boa noite.. Estou desenvolvendo um site de Reiki https://reikicuritiba.com.br/ e estou com um duvida sobre o menu de navegação da versão mobile. O menu que tem o dropdown "Terapeutas" e "Terapias" quando clico em cima ele expande como deve ser, mas quando clico denovo para recolher os submenus não acontece nada.. segue o trecho do codigo do menu.. <div class="collapse navbar-collapse" id="navbarsExample09"> <ul class="navbar-nav ml-auto"> <li class="nav-item active"><a class="nav-link" href="index.html">Home</a></li> <li class="nav-item active"><a class="nav-link" href="about-us.html">Quem Somos</a></li> <li class="nav-item dropdown1"> <a class="nav-link dropdown-toggle" data-toggle="dropdown1" href="#">Terapeutas</a> <ul class="dropdown-menu"> <li><a class="dropdown-item" href="terapeuta-julio-cezar.html">Julio Cezar</a></li> <li><a class="dropdown-item" href="terapeuta-pamela-priscila.html">Pamela Priscila</a></li> </ul> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" data-toggle="dropdown1" href="#">Terapias</a> <ul class="dropdown-menu" aria-labelledby="dropdown01"> <li><a class="dropdown-item" href="o-que-e-reiki.html">O que é Reiki</a></li> <li><a class="dropdown-item" href="beneficios-reiki.html">Benefícios do Reiki</a></li> <li><a class="dropdown-item" href="principios-reiki.html">Princípios do Reiki</a></li> <li><a class="dropdown-item" href="animais-reiki.html">Reiki em Animais</a></li> <li><a class="dropdown-item" href="animais-reiki.html">Estudos Sobre Reiki</a></li> <li><a class="dropdown-item" href="terapia-massagem-tantrica.html">Terapia Tântrica</a></li> </ul> </li> <li class="nav-item active"><a class="nav-link" href="blog.html">Blog</a></li> <li class="nav-item"><a class="nav-link" href="contato.html">Contato</a></li> </ul> </div> Obrigado Att Julio Cezar https://cristaispuroencanto.com.br/ https://www.mandalatantra.com.br/
  25. Olá....boa tarde !! Crei um menu multi-level simples em CSS: MENU_MOLDE , gostaria agora que, para: @media screen and (max-width: 900px) o menu se torne responsável, com ul li a {float: none; text-align: left; width: 100%} e ativar o submenu ao clicá-lo e desativar ao clica-lo novamente!! Alguém poderia me ajudar ?? Desde já muito obrigado !!
×
×
  • Create New...