Ir para conteúdo
  • ×   Você colou conteúdo com formatação.   Remover formatação

      Only 75 emoji are allowed.

    ×   Your link has been automatically embedded.   Display as a link instead

    ×   Your previous content has been restored.   Clear editor

    ×   You cannot paste images directly. Upload or insert images from URL.

  • Conteúdo Similar

    • Por Diego Borin
      Ola amigos, boa tarde, como não manjo muito da linguagem HTML, peço humildemente uma simples ajuda dos amigos. Estou com um código HTML que gerei para um Formulário de Cadastro de email, onde incorporei ele numa pagina dentro do meu site, para apenas quem se cadastrar poder acessar o conteúdo, so que o problema que não consigo fechar essa janela do formulário, mesmo após cadastro ele fica aberto, queria que após o usuario digitar no caso seu E-mail e nome, quando ele clicar em "Subscrible", seja concluido o processo e essa tela do Formulario se feche, para o usuario poder ter acesso ao conteudo, entendem? Vou enviar o código para vocês analisarem e se puderem me ajudar fico muito grato, se quiser colocar ja o Texto em HTML que deve acrescentar para que funcione da forma que quero podem colocar por gentileza, dai so me falam aonde tem que colocar o texto e o que tem que colocar para eu já ficar sabendo numa próximo, assim fica até mais fácil pra mim, fico no aguardo, muito obrigado.
      ESTE É O CODIGO HTML:
       
      <!-- Begin Mailchimp Signup Form -->
      <link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
      <style type="text/css">
          #mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif;  width:700px;}
          /* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
             We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
      </style>
      <div id="mc_embed_signup">
      <form action="https://estudioborin.us7.list-manage.com/subscribe/post?u=ba37986a121a69531dd8ca781&amp;id=7c624ccc19" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
          <div id="mc_embed_signup_scroll">
          <h2>Digite seu e-mail e seu nome para assistir Video Aula Gratuíta</h2>
      <div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
      <div class="mc-field-group">
          <label for="mce-EMAIL">Digite seu E-mail aqui  <span class="asterisk">*</span>
      </label>
          <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
      </div>
      <div class="mc-field-group">
          <label for="mce-FNAME">Digite seu nome aqui  <span class="asterisk">*</span>
      </label>
          <input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
      </div>
          <div id="mce-responses" class="clear">
              <div class="response" id="mce-error-response" style="display:none"></div>
              <div class="response" id="mce-success-response" style="display:none"></div>
          </div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
          <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_ba37986a121a69531dd8ca781_7c624ccc19" tabindex="-1" value=""></div>
          <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
          </div>
      </form>
      </div>
      <script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text'; /**
       * Translated default messages for the $ validation plugin.
       * Locale: PT_PT
       */
      $.extend($.validator.messages, {
          required: "Campo de preenchimento obrigat&oacute;rio.",
          remote: "Por favor, corrija este campo.",
          email: "Por favor, introduza um endere&ccedil;o eletr&oacute;nico v&aacute;lido.",
          url: "Por favor, introduza um URL v&aacute;lido.",
          date: "Por favor, introduza uma data v&aacute;lida.",
          dateISO: "Por favor, introduza uma data v&aacute;lida (ISO).",
          number: "Por favor, introduza um n&uacute;mero v&aacute;lido.",
          digits: "Por favor, introduza apenas d&iacute;gitos.",
          creditcard: "Por favor, introduza um n&uacute;mero de cart&atilde;o de cr&eacute;dito v&aacute;lido.",
          equalTo: "Por favor, introduza de novo o mesmo valor.",
          accept: "Por favor, introduza um ficheiro com uma extens&atilde;o v&aacute;lida.",
          maxlength: $.validator.format("Por favor, n&atilde;o introduza mais do que {0} caracteres."),
          minlength: $.validator.format("Por favor, introduza pelo menos {0} caracteres."),
          rangelength: $.validator.format("Por favor, introduza entre {0} e {1} caracteres."),
          range: $.validator.format("Por favor, introduza um valor entre {0} e {1}."),
          max: $.validator.format("Por favor, introduza um valor menor ou igual a {0}."),
          min: $.validator.format("Por favor, introduza um valor maior ou igual a {0}.")
      });}(jQuery));var $mcj = jQuery.noConflict(true);</script>
      <!--End mc_embed_signup-->
    • Por glrtlucas
      Boa tarde pessoal,
       
      meu conhecimento em JS é bem limitado e estou apanhando para criar o seguinte:
       
      Tenho um acordeon horizontal de imagens feito em HTML que está funcionando normalmente, neste acordeon há 8 itens.
       
      Ao clicar em um dos itens gostaria que abrisse um lightbox com imagens referentes a aquele item aberto.
       
      Abaixo estarei disponibilizando o código para vocês darem uma olhada, o item musicalização está funcionando, mas o item corpo e movimento não. Estou testando primeiramente neste dois, tendo sucesso aí replicaria para os demais itens.
       
      Estou tentando fazer isto para utilizar no WordPress, procurei e não encontrei um plugin que faça exatamente o que preciso. Um acordeon e ao clicar em algum item abra um lightbox gallery das imagens referentes ao item, só achei plugin que façam isto separadamente.
       
      Agradeço desde já.
       
      <!DOCTYPE html> <html> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> body { font-family: Verdana, sans-serif; margin: 0; } * { box-sizing: border-box; } .row > .column { padding: 0 8px; } .row:after { content: ""; display: table; clear: both; } .column { float: left; width: 25%; } /* The Modal (background) */ .modal { display: none; position: fixed; z-index: 1; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: black; } /* Modal Content */ .modal-content { position: relative; background-color: #fefefe; margin: auto; padding: 0; width: 90%; max-width: 1200px; } /* The Close Button */ .close { color: white; position: absolute; top: 10px; right: 25px; font-size: 35px; font-weight: bold; } .close:hover, .close:focus { color: #999; text-decoration: none; cursor: pointer; } .mySlides { display: none; } .cursor { cursor: pointer; } /* Next & previous buttons */ .prev, .next { cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -50px; color: white; font-weight: bold; font-size: 20px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; -webkit-user-select: none; } /* Position the "next button" to the right */ .next { right: 0; border-radius: 3px 0 0 3px; } /* On hover, add a black background color with a little bit see-through */ .prev:hover, .next:hover { background-color: rgba(0, 0, 0, 0.8); } /* Number text (1/3 etc) */ .numbertext { color: #f2f2f2; font-size: 12px; padding: 8px 12px; position: absolute; top: 0; } img { margin-bottom: -4px; } .caption-container { text-align: center; background-color: black; padding: 2px 16px; color: white; } .demo { opacity: 0.6; } .active, .demo:hover { opacity: 1; } img.hover-shadow { transition: 0.3s; } .hover-shadow:hover { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); } /* accordion */ .accordion { width: 100%; max-width: 1080px; height: 250px; overflow: hidden; margin: 50px auto; } .accordion ul { width: 100%; display: table; table-layout: fixed; margin: 0; padding: 0; } .accordion ul li { display: table-cell; vertical-align: bottom; position: relative; width: 16.666%; height: 250px; background-repeat: no-repeat; background-position: center center; transition: all 500ms ease; } .accordion ul li div { display: block; overflow: hidden; width: 100%; } .accordion ul li div a { display: block; height: 250px; width: 100%; position: relative; z-index: 3; vertical-align: bottom; padding: 15px 20px; box-sizing: border-box; color: #fff; text-decoration: none; font-family: Open Sans, sans-serif; transition: all 200ms ease; } .accordion ul li div a * { opacity: 0; margin: 0; width: 100%; text-overflow: ellipsis; position: relative; z-index: 5; white-space: nowrap; overflow: hidden; -webkit-transform: translateX(-20px); transform: translateX(-20px); -webkit-transition: all 400ms ease; transition: all 400ms ease; } .accordion ul li div a h2 { font-family: Montserrat, sans-serif; text-overflow: clip; font-size: 24px; text-transform: uppercase; margin-bottom: 2px; top: 160px; } .accordion ul li div a p { top: 160px; font-size: 13.5px; } .accordion ul li:nth-child(1) { background-image: url("https://unsplash.it/650/250?image=680"); } .accordion ul li:nth-child(2) { background-image: url("https://unsplash.it/650/250?image=668"); } .accordion ul li:nth-child(3) { background-image: url("https://unsplash.it/650/250?image=659"); } .accordion ul li:nth-child(4) { background-image: url("https://unsplash.it/650/250?image=655"); } .accordion ul li:nth-child(5) { background-image: url("https://unsplash.it/650/250?image=657"); } .accordion ul li:nth-child(6) { background-image: url("https://unsplash.it/650/250?image=661"); } .accordion ul li:nth-child(7) { background-image: url("https://unsplash.it/650/250?image=665"); } .accordion ul li:nth-child(8) { background-image: url("https://unsplash.it/650/250?image=664"); } .accordion ul:hover li { width: 8%; } .accordion ul:hover li:hover { width: 60%; } .accordion ul:hover li:hover a { background: rgba(0, 0, 0, 0.4); } .accordion ul:hover li:hover a * { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } @media screen and (max-width: 600px) { body { margin: 0; } .accordion { height: auto; } .accordion ul li, .accordion ul li:hover, .accordion ul:hover li, .accordion ul:hover li:hover { position: relative; display: table; table-layout: fixed; width: 100%; -webkit-transition: none; transition: none; } } .about { text-align: center; font-family: 'Open Sans', sans-serif; font-size: 12px; color: #666; } .about a { color: blue; text-decoration: none; } .about a:hover { text-decoration: underline; } </style> <body> <div id="accordion" class="accordion"> <ul> <li> <div> <a href="javascript:void(0)" onclick="openModal('musicalizacao');currentSlide(1)" class="hover-shadow cursor"> <h2 style="color:white;">Musicalizacao</h2> </a> </div> </li> <li> <div> <a href="javascript:void(0)" onclick="openModal('corpo-e-movimento');currentSlide(1)" class="hover-shadow cursor"> <h2 style="color:white;">Corpo e Movimento</h2> </a> </div> </li> <li> <div> <a href="javascript:void(0)" onclick="openModal();currentSlide(1)" class="hover-shadow cursor"> <h2 style="color:white;">Teatro e Contação de Estórias</h2> </a> </div> </li> <li> <div> <a href="javascript:void(0)" onclick="openModal();currentSlide(2)" class="hover-shadow cursor"> <h2 style="color:white;">Artes</h2> </a> </div> </li> <li> <div> <a href="javascript:void(0)" onclick="openModal();currentSlide(3)" class="hover-shadow cursor"> <h2 style="color:white;">Aulas de Inglês</h2> </a> </div> </li> <li> <div> <a href="javascript:void(0)" onclick="openModal();currentSlide(4)" class="hover-shadow cursor"> <h2 style="color:white;">Higiene Bucal</h2> </a> </div> </li> <li> <div> <a href="javascript:void(0)" onclick="openModal();currentSlide(5)" class="hover-shadow cursor"> <h2 style="color:white;">Capoeira</h2> <p>Extracurricular</p> </a> </div> </li> <li> <div> <a href="javascript:void(0)" onclick="openModal();currentSlide(6)" class="hover-shadow cursor"> <h2 style="color:white;">Ballet</h2> <p>Extracurricular</p> </a> </div> </li> </ul> </div> <!--<div class="row"> <div class="column"> <img src="https://www.w3schools.com/howto/img_nature.jpg" style="width:100%" onclick="openModal();currentSlide(1)" class="hover-shadow cursor"> </div> <div class="column"> <img src="https://www.w3schools.com/howto/img_snow.jpg" style="width:100%" onclick="openModal();currentSlide(2)" class="hover-shadow cursor"> </div> <div class="column"> <img src="https://www.w3schools.com/howto/img_mountains.jpg" style="width:100%" onclick="openModal();currentSlide(3)" class="hover-shadow cursor"> </div> <div class="column"> <img src="https://www.w3schools.com/howto/img_lights.jpg" style="width:100%" onclick="openModal();currentSlide(4)" class="hover-shadow cursor"> </div> </div>--> <!-- musicalizacao --> <div id="musicalizacao" class="modal"> <span class="close cursor" onclick="closeModal('musicalizacao')">&times;</span> <div class="modal-content"> <div class="mySlides"> <div class="numbertext">1 / 4</div> <img src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%"> </div> <div class="mySlides"> <div class="numbertext">2 / 4</div> <img src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%"> </div> <div class="mySlides"> <div class="numbertext">3 / 4</div> <img src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%"> </div> <div class="mySlides"> <div class="numbertext">4 / 4</div> <img src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%"> </div> <div class="mySlides"> <div class="numbertext">5 / 5</div> <img src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%"> </div> <a class="prev" onclick="plusSlides(-1)">&#10094;</a> <a class="next" onclick="plusSlides(1)">&#10095;</a> <div class="caption-container"> <p id="caption"></p> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%" id="Mus" onclick="currentSlide(1)" alt="Musicalizacao 1"> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%" id="Mus" onclick="currentSlide(2, 'Mus')" alt="Musicalizacao 2"> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%" id="Mus" onclick="currentSlide(3, 'Mus')" alt="Musicalizacao 3"> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%" id="Mus" onclick="currentSlide(4, 'Mus')" alt="Musicalizacao 4"> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_nature_wide.jpg" style="width:100%" id="Mus" onclick="currentSlide(5, 'Mus')" alt="Musicalizacao 5"> </div> </div> </div> <!-- /musicalizacao --> <!-- corpo-e-movimento --> <div id="corpo-e-movimento" class="modal"> <span class="close cursor" onclick="closeModal('corpo-e-movimento')">&times;</span> <div class="modal-content"> <div class="mySlides"> <div class="numbertext">1 / 4</div> <img src="https://www.w3schools.com/howto/img_lights_wide.jpg" style="width:100%"> </div> <div class="mySlides"> <div class="numbertext">2 / 4</div> <img src="https://www.w3schools.com/howto/img_lights_wide.jpg" style="width:100%"> </div> <div class="mySlides"> <div class="numbertext">3 / 4</div> <img src="https://www.w3schools.com/howto/img_lights_wide.jpg" style="width:100%"> </div> <div class="mySlides"> <div class="numbertext">4 / 4</div> <img src="https://www.w3schools.com/howto/img_lights_wide.jpg" style="width:100%"> </div> <a class="prev" onclick="plusSlides(-1)">&#10094;</a> <a class="next" onclick="plusSlides(1)">&#10095;</a> <div class="caption-container"> <p id="caption"></p> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_lights_wide.jpg" style="width:100%" onclick="currentSlide(1)" alt="Corpo e Movimento 1"> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_lights_wide.jpg" style="width:100%" onclick="currentSlide(2)" alt="Corpo e Movimento 2"> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_lights_wide.jpg" style="width:100%" onclick="currentSlide(3)" alt="Corpo e Movimento 3"> </div> <div class="column"> <img class="demo cursor" src="https://www.w3schools.com/howto/img_lights_wide.jpg" style="width:100%" onclick="currentSlide(4)" alt="Corpo e Movimento 4"> </div> </div> </div> <!-- /corpo-e-movimento --> <script> function openModal(id) { if(id === 'musicalizacao'){ document.getElementById('musicalizacao').style.display = "block"; document.getElementById('accordion').style.display = "none"; document.getElementById('masthead').style.display = "none"; } else { if(id === 'corpo-e-movimento') { document.getElementById('corpo-e-movimento').style.display = "block"; document.getElementById('accordion').style.display = "none"; document.getElementById('masthead').style.display = "none"; } } } function closeModal(id) { if(id === 'musicalizacao'){ document.getElementById('musicalizacao').style.display = "none"; document.getElementById('accordion').style.display = "block"; document.getElementById('masthead').style.display = "block"; } else { if(id === 'corpo-e-movimento'){ document.getElementById('corpo-e-movimento').style.display = "none"; document.getElementById('accordion').style.display = "block"; document.getElementById('masthead').style.display = "block"; } } } var slideIndex = 1; showSlides(slideIndex); function plusSlides(n) { showSlides(slideIndex += n); } function currentSlide(n, item) { showSlides(slideIndex = n); } function showSlides(n) { var i; var slides = document.getElementsByClassName("mySlides"); var dots = document.getElementsByClassName("demo"); var captionText = document.getElementById("caption"); if (n > slides.length) {slideIndex = 1} if (n < 1) {slideIndex = slides.length} for (i = 0; i < slides.length; i++) { slides[i].style.display = "none"; } for (i = 0; i < dots.length; i++) { dots[i].className = dots[i].className.replace(" active", ""); } slides[slideIndex-1].style.display = "block"; dots[slideIndex-1].className += " active"; captionText.innerHTML = dots[slideIndex-1].alt; } </script> </body> </html>  
    • Por wellingtonmelo
      Olá pessoal, beleza?
       
      Entendo bem de HTML, CSS, Bootstrap, mas funções dinâmicas que necessitam de Javascript, Jquary etc, eu não sei nada.
       
      Consegui um script e estou testando, mas o resultado é exibido em uma DIV, e preciso que esse resultado seja exibido em um input, para que o programador possa pegar esse resultado e jogar no banco.
       
      Olha o código:
      <script type="text/javascript"> function clicar() { var num1 = document.querySelector(".num1").value; var num2 = document.querySelector(".num2").value; var num3 = document.querySelector(".num3").value; var num4 = document.querySelector(".num4").value; var resultado = parseInt(num1) - parseInt(num2) - parseInt(num3) - parseInt(num4); document.querySelector(".resultado").innerHTML = resultado; } </script> <style type="text/css"> .num1{ float: right; width: 70%} .num2{ float: right; width: 70%} .num3{ float: right; width: 70%} .num4{ float: right; width: 70%} .resultado{ float: right; width: 70%} </style> QNT. DISPONÍVEL:<input class="num1" type="number" value="12" disabled><br><br> Tamanho 35/36: <input class="num2" type="number"><br><br> Tamanho 37/38: <input class="num3" type="number"><br><br> Tamanho 39/40: <input class="num4" type="number"><br><br> RESTAM: <div class="resultado"></div> <button onclick="clicar()">Resultado</button> Está fazendo a subtração do total (12), e mostrando quanto que resta.
       
      Porém, o meu amigo, outro piorque eu, programador meia boca que esta trabalhando comigo, disse que precisa que esse resultado apareça dentro de um input com disabled.
       
      Vi alguns script que ensinam a exibir a div dentro de um input, porém não consegui replicar.
       
      Preciso que o conteúdo da div:
      <div class="resultado"></div>
       
      Apareça dentro de um input, exemplo:
      <input class="num4" type="text" value="   <div class="resultado"></div>    ">
       
      Alguém pode me ajudar? Estou muito preocupado, estourou o prazo e apareceu isso para fazer por fora do projeto.
       
      Abraço!!
      Obrigado!!
       
      OBS: Link onde estamos montando: http://spaflex.com.br/index.php?p=produto&amp;id=200043&amp;site=ad49f8e1bf4d27941b6051d14376304d4
    • Por marcelocardoso
      Olá Colegas....

      Tenho o código abaixo que funciona perfeitamente, fiz algumas modificações no CSS e também no JQUERY, segue abaixo...
      O PROBLEMA é que ao dar um refresh na página, F5 no brownser, ele como DEFAULT se perde o background, ficando TRANSPARENT.

      1) Que é o modo que ele deve começar;
      2) Mas como ele muda após se o window for maior >=20, no jquery;
      3) Ao dar refresh, dependendo do lugar da página, ele deveria ficar o mesmo, mas fica sempre transparente;

      CODIGO HTML
      <nav class="navbar navbar-light navbar-fixed-top"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar_menu" aria-expanded="false"> <span class="fa fa-bars"></span> </button> <a href="http://" class="navbar-brand brand-centered"> <img src="img/logo.png" class="img-responsive"> </a> </div> <div class="collapse navbar-collapse" id="navbar_menu"> <ul class="nav navbar-nav navbar-right"> <li><a href="#mn_empresa">EMPRESA</a></li> <li><a href="#mn_clientes">CLIENTES</a></li> <li><a href="#mn_formulario">CONTATO</a></li> </ul> </div> </div> </nav>
      CODIGO CSS
      /* NAVBAR */ .navbar { padding-top: 5px; padding-bottom: 12px; background-color: transparent; margin: 0px; color: #333; transition: all 0.3s; z-index: 9999; -webkit-box-shadow: 0px 0px 5px -1px rgba(171, 171, 171, 1); -moz-box-shadow: 0px 0px 5px -1px rgba(171, 171, 171, 1); box-shadow: 0px 0px 5px -1px rgba(171, 171, 171, 1); } /* NAVBAR - efeito simples dos itens do menu */ .navbar-nav a, .navbar-nav a.active { color: #00224b !important; background-color: transparent; font-size: 15px; font-weight: 600; width: 100%; -moz-transition: all .3s; -o-transition: all .3s; -webkit-transition: all .3s; transition: all .3s; } .navbar-nav li a:hover, .navbar-nav li.active a { color: #f4511e !important; background-color: white; font-weight: 600; width: 100%; } /* NAVBAR - toggle button */ .navbar-light .navbar-toggle { border: none; border-radius: 40px; width: 40px; height: 40px; font-size: 20px; z-index: 12; background-color: dodgerblue; color: white; cursor: pointer; -moz-transition: all .8s; -o-transition: all .8s; -webkit-transition: all .8s; transition: all .8s; } .navbar-light .navbar-toggle:hover { background-color: #f6761c; border-radius: 40px 0px 40px 40px; color: white; } /* NAVBAR - mudanças jquery */ .navbar-brand.nav_corlogo { height: auto; filter: brightness(0) invert(1) !important; } .navbar-nav.nav_cormenu a, .navbar-nav.nav_cormenu a.active { color: white !important; } .navbar-nav.nav_cormenu li a:hover, .navbar-nav.nav_cormenu li.active a { color: #ff9326 !important; background-color: transparent; } .navbar.nav_sombra { -webkit-box-shadow: 0px 2px 12px -1px rgba(31, 31, 31, 0.39); -moz-box-shadow: 0px 2px 12px -1px rgba(31, 31, 31, 0.39); box-shadow: 0px 2px 12px -1px rgba(31, 31, 31, 0.39); border-bottom: 2px solid rgba(118, 0, 191, 0.56); } .navbar.nav_comprime { padding-top: 10px; padding-bottom: 10px; background: #002a5c; color: white; box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.5); -moz-transition: all .4s; -o-transition: all .4s; -webkit-transition: all .4s; transition: all .4s; } .navbar.nav_slide { background-color: transparent !important; } /* NAVBAR - config do logotipo imagem e logo texto */ .navbar-brand { padding: 4px; position: absolute; font-size: 1.25rem; white-space: nowrap; } .navbar-brand>img { padding: 0px; width: 16%; } .navbar-brand:focus, .navbar-brand:hover { text-decoration: none; color: white }
      CODIGO JQUERY
       
      $(function () { $(window).on('scroll', function () { if ($(this).scrollTop() >= 20) { $('.navbar').addClass('nav_comprime'); $('.navbar').addClass('nav_sombra'); $('.navbar-nav').addClass('nav_cormenu'); $('.navbar-brand').addClass('nav_corlogo'); } else { $('.navbar').removeClass('nav_comprime'); $('.navbar').removeClass('nav_sombra'); $('.navbar-nav').removeClass('nav_cormenu'); $('.navbar-brand').removeClass('nav_corlogo'); } }); $('.navbar a').on('click', function () { if (window.innerWidth <= 768) { $('.navbar-toggle').trigger("click"); } }); //função que troca em resoluções menores o logotipo $(window).resize(function () { if ($(window).width() < 481) { $('#logotipo').attr('src', '../site/img/simbolo.png'); } else { $('#logotipo').attr('src', '../site/img/logo_-_original.png'); } }); $(".navbar a, footer a[href='#wrapper']").on("click", function (event) { event.preventDefault(); var hash = this.hash; $("html, body").animate({ scrollTop: $(hash).offset().top }, 800, function () { window.location.hash = hash; }); }); }); Se conseguirem me dar uma luz, agradeço.
      Posso estar errando no CSS ou JQUERY.
      Obrigado.


       
    • Por lotustechnology
      Olá a todos, gostaria de saber se é possível procurar uma palavra em um arquivo e depois substituir a linha toda por uma palavra abaixo o código no arquivo Index.php:
      <title>LotusTechnology - inicio</title> Aí eu pretendo procurar apenas a tag <title> e logo após queria substituir a linha toda por um novo conteúdo, tenho o seguinte código PHP:
      $title_site = trim(htmlspecialchars($_POST['title_site'])); Aí acima eu tenho o POST aonde eu vou ter o novo título do site.
      Então seria basicamente entrar no arquivo HTML procurar apenas pela tag HTML que está em uma linha e depois substituir por um novo conteúdo, porém desde que eu consiga apagar todo o conteúdo da linha com apenas a TAG title e depois substituir tudo o que vier depois da linha por um novo conteúdo está de acordo com o que preciso. Lembrando que coisas como:
       
      Ir em determinada pelo número não poderá ser pois o site está sendo totalmente manipulado literalmente.
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.