Jump to content

Maira Torresani

Members
  • Content count

    15
  • Joined

  • Last visited

Community Reputation

0 Comum

About Maira Torresani

  • Birthday 03/12/1997

Informações Pessoais

  • Sexo
    Feminino
  1. Estou fazendo um popup que abre quando o usuário vai sair da página, para isso usei o evento onmouseout="" na tag body. Na minha página teste funciona perfeitamente, o código dela está abaixo. Porém, quando coloco o mesmo código na página teste do cliente, o onmouseout não funciona corretamente. Ele está executando a função ao mover o mouse dentro da página e não para fora como deveria ser. Penso que talvez tenha algum conflito na página ou algo assim, mas não achei o erro. A página é essa: https://www.enlevolar.com.br/home-teste-popup E o código é esse, que funciona na página teste mas fica bugado na página do cliente: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> function abrepopup() { if ((!window.localStorage.getItem("popup-exibida"))&&(!window.sessionStorage.getItem("popup-session"))) { document.getElementById("popup").style.display="block"; document.getElementsByTagName("body")[0].removeAttribute("onmouseout"); window.sessionStorage.setItem("popup-session", "1"); } }; function fechapopup() { document.getElementById("popup").style.display="none"; document.getElementsByTagName("body")[0].removeAttribute("style"); }; function troca2() { document.getElementById("caixa-popup1").style.display="none"; document.getElementById("caixa-popup2").style.display="block"; }; var filter = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i; function setCodigoLinha(linha) { if(linha == 1) { document.getElementById("codigo-desconto-popup").value="1primeiraCompra"; document.getElementById("link-linha-popup").href="/produto/listar/Cama"; document.getElementById("img-linha-popup").src="//d8vlg9z1oftyc.cloudfront.net/garmisch/image/media/COBRE%20LEITO%20REQUINTE%20COR%201_56154fbf778be.jpg"; document.getElementById("nome-linha-popup").value="Linha Cama"; } else if(linha == 2) { document.getElementById("codigo-desconto-popup").value="2primeiraCompra"; document.getElementById("link-linha-popup").href="/produto/listar/Banho"; document.getElementById("img-linha-popup").src="//d8vlg9z1oftyc.cloudfront.net/garmisch/image/media/Valencia_DAN0241_5615502a74c18.jpg"; document.getElementById("nome-linha-popup").value="Linha Banho"; } if(!filter.test(document.getElementById("email-desconto-popup").value)) { document.getElementById("escolha-a-linha-erro").innerHTML="Insira um e-mail válido para ganhar o desconto!"; } else { document.getElementById("caixa-popup2").style.display="none"; document.getElementById("caixa-popup3").style.display="block"; /*window.localStorage.setItem("popup-exibida", "1");*/ } }; </script> <style> #popup{background-color: rgba(0,0,0,0.5); width: 100%; height: 100%; position: fixed; z-index: 10000; overflow: auto;} .caixa-popup{background-color: #fff; width: 700px; height: auto; margin-top: 10% !important; margin: auto; text-align: center; padding: 3%;} @media(max-width: 700px){ .caixa-popup{width: 100%;} } .caixa-popup .titulo{padding-bottom: 4%; border-bottom: 1px solid rgba(0,0,0,0.3); display: block; margin-bottom: 4%;} .caixa-popup #fechapop{float: right; z-index: 1; cursor:pointer;} .caixa-popup h1, .caixa-popup p{margin: 2% 7%;} .caixa-popup input[type="button"]{width: 30%; margin:5% 5% 2% 5%; background: #722b2b; color:#fff; padding: 3% 0;} .caixa-popup input[type="button"]:hover, {opacity: 0.95;} .caixa-popup .button-semdestaque{background: #fff !important; color: #595959 !important;} .caixa-popup .p-option{width: 30%; text-align: center; display:inline;} .caixa-popup .newsletter input[type="radio"]{display: inline; height: auto; width: auto; padding: 1%; -webkit-appearance: radio; min-height: auto; margin: 2% 1%;} .caixa-popup .quero-meu-desconto{position: relative; width: 40%; margin: 2%; background: #722b2b; color:#fff; padding: 3% 1%;} .caixa-popup #img-linha-popup, .caixa-popup #nome-linha-popup{width: 50%; margin: 0 auto; border: 1px solid #722b2b; background-color: #fff; color: #722b2b; font-size: 1.3em;} .caixa-popup #email-desconto-popup{width: 85%;} .caixa-popup #codigo-desconto-popup{max-width: 100%; background: #722b2b; text-align: center; border: none;margin-top: 2%; color: #fff; cursor:text;} @media(max-width: 500px){ .caixa-popup .p-option{margin: 2% 5%; display: inline-block;} } </style> </head> <body onmouseout="abrepopup()" style="height: 1000px;"> <div id="container"> <div id="popup" style="display: none;"> <div id="caixa-popup1" class="caixa-popup" style="display: block;"> <div id="fechapop" onclick="fechapopup()">X</div> <h3 class="titulo">Você quer</h3> <h1 class="titulo"> GANHAR <strong>R$10</strong> DE DESCONTO<br><span>em sua primeira compra?</span></h1> <input type="button" value="SIM" onclick="troca2()" style="font-size: 1.6em;"> <input type="button" class="button-semdestaque" value="NÃO" onclick="fechapopup()"><br> <p class="p-option">Quero ganhar o desconto!</p> <p class="p-option">Não gosto de descontos.</p> </div> <div id="caixa-popup2" class="caixa-popup" style="display: none;"> <div id="fechapop" onclick="fechapopup()">X</div> <h3 class="titulo">Informe seu e-mail e</h3> <h1>ESCOLHA UMA LINHA PARA GANHAR O DESCONTO</h1> <p class="titulo">Além de ganhar um desconto exclusivo, você ainda vai receber todas as nossas novidades e promoções em seu e-mail!</p> <div class="newsletter relative color_default button_in_input"> <input id="email-desconto-popup" type="email" placeholder="Seu e-mail" class="flexy-newsletter-email w_full fs_medium fw_light error form-control" required=""> <div class="message_container_subscribe d_none m_top_20"></div> <button class="flexy-newsletter-sigin quero-meu-desconto" onclick="setCodigoLinha(1)">Quero Desconto na Linha Cama</button> <button class="flexy-newsletter-sigin quero-meu-desconto" onclick="setCodigoLinha(2)">Quero Desconto na Linha Banho</button> </div> <p id="escolha-a-linha-erro" style="color: #722b2b;"></p> </div> <div id="caixa-popup3" class="caixa-popup" style="display: none;"> <div id="fechapop" onclick="fechapopup()">X</div> <h1> <span>Seu código de desconto é<br> <input type="text" id="codigo-desconto-popup" name="codigodesc" value="codigodesc" disabled="disable"></span> </h1> <p class="titulo">Insira este código no checkout para ganhar o desconto!</p> <h2 style="margin: 2%;">Clique para Comprar Agora:</h2> <a id="link-linha-popup" href=""><img id="img-linha-popup" src=""><br><input type="button" id="nome-linha-popup" value=""></a> <p onclick="fechapopup()" style="color: #722b2b; cursor: pointer; margin-top: 5%;">ou<br>Continue no site</p> </div> </div> </div> <div style="height: 200%; background: red;"></div> </body> </html>
  2. Maira Torresani

    Onclick não funciona!

    Agora fiz assim, funciona. Mas o onmouseout tá bugado, ele aparece quando move o mouse para dentro da página. https://www.enlevolar.com.br/home-teste-popup
  3. Maira Torresani

    Onclick não funciona!

    Agora funcionou, será que era porque eu tinha colocado o script no body ao invés de colocar no header? Mas... quando coloco o mesmo código na página ele ativa a função de abrir quando meche o mouse dentro da página e não fora. Algum conflito talvez? Muito obrigada.
  4. Maira Torresani

    Onclick não funciona!

    Está funcionando agora a função fechapopup(), mas a de abrir está sendo executada quando a página é carregada, ou melhor, quando eu mecho o mouse dentro da página Se isso ajudar, o problema está nessa página: http://www.enlevolar.com.br/
  5. Maira Torresani

    Onclick não funciona!

    Mas essa está funcionando, eu quero que o popup abra quando o usuário for sair da página, no caso tirar o mouse. Isso está do jeito que eu quero, só não sei porque não funciona a função fechapopup(), fazendo testes vi que o problema não é o onclick já que outra função com o click funcionou. Já editei o post. ^_^
  6. Maira Torresani

    Onclick não funciona!

    Estou fazendo um popup, mas o evento onclick não está funcionando, não estou usando jQuery, apenas javascript. Minhas funções: function abrepopup() { document.getElementById("popup").style.display="block"; }; function fechapopup() { document.getElementById("popup").style.display="none !important"; }; function troca2() { document.getElementById("caixa-popup1").style.display="none"; document.getElementById("caixa-popup2").style.display="block"; }; O código html: <body onmouseout="abrepopup()" style="height: 1000px;"> <div id="container" > <div id="popup" style="display: none;"> <div id="caixa-popup1" class="caixa-popup" style="display: block;"> <input type="button" style="float: right; z-index: 1;" onclick="fechapopup()" value="X"> <h1> <span class="titulo">Você quer</span><br> <span>GANHAR R$10,00 DE DESCONTO</span> </h1> <p>em sua primeira compra?</p> <input type="button" value="Sim" onclick="troca2()"> <input type="button" value="Não" onclick="fechapopup()"> </div> <div id="caixa-popup2" class="caixa-popup" style="display: none;"> <input type="button" style="float: right; z-index: 1;" onclick="fechapopup()" value="X"> <h1> <span class="titulo">Informe seu e-mail e</span><br> <span>ESCOLHA UMA LINHA PARA GANHAR O DESCONTO</span> </h1> <p></p> <input type="button" value="Sim" onclick="troca2()"> <input type="button" value="Não" onclick="fechapopup()"> </div> </div> </div> </body> As funções abrepopup() e troca2() estão funcionando perfeitamente, só o que não funciona é a função fechapopup()...
  7. Maira Torresani

    Função de envio de e-mail php

    1 - Colocar a action dos formulários todas apontando para o mesmo lugar (se os formulários forem iguais). Aí você monta apenas uma rotina de envio. Sim, no momento eles estão, mas não quero que vá para outra página, se for pra fazer a validação em outra página depois ele tem que voltar para a página anterior e esse é um dos problemas já que são páginas diferentes entaõ não sei como faria um header(location:) que voltasse para a pagina anterior. 2 - Fazer o envio das informações por JavaScript/AJAX. Aí você não precisa recarregar a página. Só sei fazer o envio com phpmailer, não acho um tutorial bom de como fazer isso com javascript
  8. Maira Torresani

    Função de envio de e-mail php

    Bem, eu tenho um form e preciso enviar os dados que o usuário preencher para um e-mail. O problema é que eu tenho uma função que envia o e-mail, tenho esse formulário em 3 páginas diferentes do site então não dá pra fazer o header(location:page) porque assim eu teria que fazer um arquivo diferente para cada página. O que eu queria fazer e não achei como, é se tem como passar os valores do form por parâmetros de uma função sem precisar ir para outra página para executar a função. Pode ser com javaScript se der.
  9. Maira Torresani

    Problema com scale no background-color

    O html: <section class="content-maior bg-body"><h1 class="fontzero">Linhas de Produtos</h1> <a href="linha-medica"><article class="box-small al-center bg-body"> <img class="img-small" title="NKL Produtos Eletrônicos | Linha Médica" alt="NKL Produtos Eletrônicos | Linha Médica" src="<?php bloginfo('template_url'); ?>/img/nkl_produtos_eletronicos-icon_linha_medica.png"> <h1 class="fontsize4b">Linha Médica<br><span style="visibility: hidden;">.</span></h1> <p class="tagline fontsize3">Descrição Descrição Descrição Descrição Descrição Descrição Descrição Descrição </p> </article></a> <a href="linha-veterinaria"><article class="box-small al-center bg-body"> <img class="img-small" title="NKL Produtos Eletrônicos | Linha Veterinária" alt="NKL Produtos Eletrônicos | Linha Veterinária" src="<?php bloginfo('template_url'); ?>/img/nkl_produtos_eletronicos-icon_linha_veterinaria.png"> <h1 class="fontsize4b">Linha Veterinária<br><span style="visibility: hidden;">.</span></h1> <p class="tagline fontsize3">Descrição Descrição Descrição Descrição Descrição Descrição Descrição Descrição </p> </article></a> <a href="linha-de-medicao-e-monitoramento"><article class="box-small al-center bg-body"> <img class="img-small" title="NKL Produtos Eletrônicos | Linha de Medição e Monitoramento" alt="NKL Produtos Eletrônicos | Linha de Medição e Monitoramento" src="<?php bloginfo('template_url'); ?>/img/nkl_produtos_eletronicos-icon_linha_medicao_e_monitoramento.png"> <h1 class="fontsize4b">Linha de Medição e <br>Monitoramento</h1> <p class="tagline fontsize3">Descrição Descrição Descrição Descrição Descrição Descrição Descrição Descrição </p> </article></a> <a href="linha-de-seguranca-eletrica"><article class="box-small al-center bg-body"> <img class="img-small" title="NKL Produtos Eletrônicos | Linha de Segurança Elétrica" alt="NKL Produtos Eletrônicos | Linha de Segurança Elétrica" src="<?php bloginfo('template_url'); ?>/img/nkl_produtos_eletronicos-icon_linha_de_seguranca_eletrica.png"> <h1 class="fontsize4b">Linha de Segurança <br>Elétrica</h1> <p class="tagline fontsize3">Descrição Descrição Descrição Descrição Descrição Descrição Descrição Descrição </p> </article></a> </section> O css: /*imagem das 4 linhas*/ .content-maior a:link, .content-maior a:active, .content-maior a:visited{color: #444444;} .content-maior a:hover{color: #008BFF;} .box-small{position: relative; top: -200px; height: auto; width: 22%; margin: 0 1.5%; float: left; border: 1px solid rgba(0,139,255,0.5); transition: all 0.05s ease-in-out;-webkit-transition: all 0.05s ease-in-out; -moz-transition: all 0.05s ease-in-out;} .box-small:hover{border: 1px solid #008BFF; transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05);} .box-small h1{margin-bottom: 3%;} .box-small p{padding: 0 5% 8% 5%; margin: 0;} .box-small .text{margin-top: 7%;} .img-small{float: none; margin: 4% auto; transition: all 0.05s ease-in-out;-webkit-transition: all 0.05s ease-in-out; -moz-transition: all 0.05s ease-in-out; width: auto; position: relative; height: 75px; display: inline-block; background-color: #5A5E5E;} .box-small:hover img{border: 0 !important; background-color: #008BFF;} O problema pode ser visto nessa página: http://nkl.kamersmarketing.com.br/
  10. Maira Torresani

    Problema com scale no background-color

    Não funcionou, mas testando com o background-clip: content-box; sumiu a linha em baixo, mas ainda fica nos lados da imagem como se a cor de fundo estivesse saindo fora.
  11. Maira Torresani

    Problema com scale no background-color

    O problema é q eu tenho uma div, o hover dela faz o seguinte: .box-small:hover{border: 1px solid #008BFF; transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05);} dentro dessa div eu tenho uma imagem, com o fundo transparent, o hover dessa imagem muda o background-color dela: .box-small:hover img{border: 0 !important; background-color: #008BFF;} mas o problema é que está ficando tipo de uma borda quando dá o hover, eu já testei o mesmo efeito sem o scale e isso não acontece. Porém quando a box-small está com efeito de scale a imagem fica com esse tipo de borda. O efeito está nessa página: http://nkl.kamersmarketing.com.br/ ali onde tem as linhas de produtos. O que eu quero é evitar que fique com essas bordas na imagem com o hover.
  12. Maira Torresani

    Máscara para telefone em jQuery não funciona

    Era isso mesmo. Muito obrigada!
  13. Maira Torresani

    Máscara para telefone em jQuery não funciona

    Sim, faltava o J. Mas ainda não é isso. O erro que dá: Uncaught TypeError: $(...).mask is not a function Aliás, esse é meu projeto se quiser ver melhor o código: http://nkl.kamersmarketing.com.br/
  14. Maira Torresani

    Máscara para telefone em jQuery não funciona

    É que eu nunca usei jQuery antes, você quer dizer que não vai dar conflito se eu usar só a "$"? chamei os arquivos assim: <script src="js/jquery-1.11.3.min.js" type="text/javascript"></script> <script src="js/menu.js" type="text/javascript"></script> <script src="js/botao.js" type="text/javascript"></script> <script src="s/mask.js" type="text/javascript"></script> Deixei o arquivo mask desse jeito aí. Mas não está funcionando. Obrigada por responder :)
  15. Estou tentando fazer uma máscara para campos de telefone utilizando o jQuery, mas não está aplicando por algum motivo. Tenho 3 arquivos js, então pensei que fosse conflito de jQuery. Porém, em um usei a variável $, no outro jQuery e nesse do input usei $j = jQuery.noConflict();Os dois primeiros arquivos estão funcionando perfeitamente, mas nesse não consigo achar o problema. O código: $j(document).ready(function(){ $j(function(){ $j(".campoTelefone").mask("(99)9999-9999"); }); });
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.