caros amigos estou finalizando o layout do meu blog e gostaria de por um efeito no banner dele tenho um modelo mas estudei o css minunciosamente e não consigo por o efeito será que alguem poderia me ajudar?
o efeito é tipo umas bolhas subindo quando no estado hover o site para ver ele funcionando é este: Clique aqui e o efeito fica nos frascos lá em baixo onde tem as bolhas subindo... eu gostaria de colocar um efeito deste no entanto não estou conseguindo... estou testando no rodapé do meu projeto Clique aqui onde tem um pinguim de ponta cabeça. se alguem puder me ajudar agradeço!!
Efeito Bubbles Alguem Pode Me Ajudar?
Started By jonny_pingonope, 28/12/2011, 16:50
2 replies to this topic
#1
Posted 28/12/2011, 16:50
#2
Posted 28/12/2011, 18:03
vc não acho pke uso jquery junto
$(function() { bubbles(); }); function bubbles() { $('a.beaker').append('<span class="bubbles"><span class="strip"></span></span>'); var bgPosition = 0; var resetBg = function() { var self = this; $('.strip', this).css({ 'top': 0 }); }; var moveBg = function() { var self = this; bgPosition += 200; $('.strip', this).css({ 'top': -bgPosition + 'px' }); }; $('.item a').hover(function() { //alert('on'); var parentItem = $(this).parents('.item'); var theBubbles = $('.bubbles', parentItem); bubblingInterval = setInterval(function() {}); //bubblingTimeout = setTimeout(function() { $(theBubbles).stop().animate({ 'opacity': 1 }, 900, 'easeOutSine'); bubblingInterval = setInterval(function() { moveBg.apply(theBubbles); }, 90); //}, 100) },function() { //clearTimeout(bubblingTimeout); clearInterval(bubblingInterval); var parentItem = $(this).parents('.item'); var theBubbles = $('.bubbles', parentItem); bgPosition = 0; $(theBubbles).stop().animate({ 'opacity': 0 }, 500, 'easeOutSine', function() { resetBg.apply(theBubbles); }); }); };
#3
Posted 30/12/2011, 13:53
estou tentando colocar isso mas nem sinal de conseguir!!! peguei o jquery e chamei ele mas ainda não funciona! será que declarei a chamada pois no wordpress fica mais complicado?
to colocando no http://testes.pingonope.com estou tentando colocar no rodapé!
--------
já consegui amigos valeu!!!
to colocando no http://testes.pingonope.com estou tentando colocar no rodapé!
--------
vc não acho pke uso jquery junto
$(function() { bubbles(); }); function bubbles() { $('a.beaker').append('<span class="bubbles"><span class="strip"></span></span>'); var bgPosition = 0; var resetBg = function() { var self = this; $('.strip', this).css({ 'top': 0 }); }; var moveBg = function() { var self = this; bgPosition += 200; $('.strip', this).css({ 'top': -bgPosition + 'px' }); }; $('.item a').hover(function() { //alert('on'); var parentItem = $(this).parents('.item'); var theBubbles = $('.bubbles', parentItem); bubblingInterval = setInterval(function() {}); //bubblingTimeout = setTimeout(function() { $(theBubbles).stop().animate({ 'opacity': 1 }, 900, 'easeOutSine'); bubblingInterval = setInterval(function() { moveBg.apply(theBubbles); }, 90); //}, 100) },function() { //clearTimeout(bubblingTimeout); clearInterval(bubblingInterval); var parentItem = $(this).parents('.item'); var theBubbles = $('.bubbles', parentItem); bgPosition = 0; $(theBubbles).stop().animate({ 'opacity': 0 }, 500, 'easeOutSine', function() { resetBg.apply(theBubbles); }); }); };
já consegui amigos valeu!!!
0 user(s) are reading this topic
0 membro(s), 0 visitante(s) e 0 membros anônimo(s)