Denise DR
-
Total de itens
1 -
Registro em
-
Última visita
Sobre Denise DR
Denise DR's Achievements
0
Reputação
-
Boa tarde, Tenho um formulário que, além de enviar um email em submit, deve executar certo script exibindo uma imagem de agradecimento. A idéia é a seguinte: a imagem sobe, como um slide, e fica alguns segundos na tela. Após esses segundos de execução a imagem desce, também como slide. A imagem deve cobrir o formulário. Consegui que a imagem subisse como slide e cobrisse o formulário. Porém testei algumas formas para que o slide permanecesse por 10 segundos e após isso descesse como slide, sem sucesso. A propriedade overflow também não funcionou muito bem, então a imagem aparece na tela mesmo fora do quadro. Uso o Jquery 1.2.6 min para o efeito. Ainda não testei dentro do formulário, portanto não sei se há possibilidades de haver conflito com o script de validação do mesmo (a validação e envio de email já funcionam sem problemas). E na página que se encontra o formulário há outro efeito sendo executado em Prototype+Scriptaculous, a propriedade noconflict já é suficiente para um não interferir no outro? Aqui vai o código da minha versão de testes: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jQuery Slider Menu</title> <script type="text/javascript" src="jquery-1.2.6.min.js"></script> <style type="text/css"> body { margin: 0; } #sliderWrap { margin: 0; width: 342px; height:364px; overflow:hidden; border:5px solid #000; } #slider { position: absolute; background-image:url(slider.png); background-repeat:no-repeat; background-position: bottom; width: 342px; height: 364px; margin-top: 364px; overflow:hidden; } #slider img { border: 0; } a.topMenuAction{ position:absolute; color:#0F0; } #openCloseIdentifier{ overflow:hidden;} </style> </head> <body> <script type="text/javascript"> $(document).ready(function() { $(".topMenuAction").click( function() { if ($("#openCloseIdentifier").is(":hidden")) { $("#slider").animate({ marginTop: "364px" }, 500 ); $("#openCloseIdentifier").show(); } else { $("#slider").animate({ marginTop: "0px" }, 500 ); $("#openCloseIdentifier").hide(); } }); }); </script> <div id="sliderWrap"> <a href="#" class="topMenuAction"> Submit </a> <div id="openCloseIdentifier"></div> <div id="slider"> </div> </div> </body> </html> E aqui vai o link para download de todos os arquivos com os quais estou trabalhando: submit.zip