Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Galera, acho que minha duvida é simples, mas não consigo resolver. Tentem me ajudar, por favor?
Tenho uma div, essa div tem um background e um outro background para quando estiver com o mouseover. Isso no CSS. Gostaria de inserir um jquery para que, nessa transição de mouseover, ela seja feita em Fade.
O código está abaixo ...
Podem me ajudar? Valeeu em!
O CSS
#chamada1{
background:url(../img/chamada1.jpg);
background-repeat:repeat-x;
width:100%;
height:130px;
}
#chamada1:hover{
background:url(../img/chamada1.2.jpg);
background-repeat:repeat-x;
width:100%;
height:130px;
}
O HTML
<div id="chamada1">
<p>Lorem Ipsum é simplesmente uma simulação de texto da indústria tipográfica e de impressos, e vem sendo utilizado desde o século XVI, quando um impressor .</p>
</div>Como eu posso adaptar isso ao meu código. Pois da maneira que eu tentei colocar agora, ele continuou mudando sem fade. Eu quero uma transição suave, entende?
Valeu cara!!!
onde esta div no código você vai colocar a class ou o ID da div.
Então, na verdade eu fiz isso, mas ele continuou fazendo a mudança "brusca", sem suavização. Poderia me dizer o que é?
se tratando de menus com efeitos jQuery você precisa declarar o ready do jquery para que não precise chamar alguma função para executar o mesmo...
exemplo:
<script type="text/javascript">
$(document).ready(function(){ // declaração do ready
$("#id_do_menu").hover(
function(){
$(this).stop().animate({ opacity: 1.0 }, 1000); // o 1000 serve para controlar a velocidade do efeito
},function(){
$(this).stop().animate({ opacity: 0 }, 1000);
});
});
</script>
fiz um tutorial no meu site de como fazer um menu animado com jQuery segue o link abaixo:
http://www.darcweb.com.br/VerPost/2/2-Criando_um_menu_animado_com_jQuery_e_css
espero que ajude... :thumbsup:
isso não é necessário cara, no mouseOver você altera as propriedades do css.