Mil Trucos Blogger

Globos que caen y se desvanecen en el blog

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

Muchos bloggers buscan darle a su blog un aspecto diferente cuando este esta de aniversario,y aunque pueden haber muchos trucos en la red para darle un toque especial al blog ninguno es como el que les voy a presentar hoy en el cual unos hermosos globos van cayendo y poco a poco se van desvaneciendo.

En el truco se vera el siguiente globo.


Para agregar este truco ve  a Diseño | Añadir un gadget | HTML/Javascript y alli pegas lo siguiente:

    <script>
    /***** Globos cayendo en el blog *****/
    if(typeof $pdj=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(typeof $pdj=='undefined'){var $pdj=jQuery.noConflict()}if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['corazon']="http://www.miltrucosblogger.com/wp-content/uploads/2012/02/globos-10.gif";$pdj(document).ready(function(){var c=$pdj(window).width();var d=$pdj(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(8500,10000),function(){$pdj(this).fadeOut('slow',function(){f(a)})})},e(1,9000))};$pdj('<div></div>').attr('id','corazonDiv').css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=15;i++){var g=$pdj('<img/>').attr('src',image_urls['corazon']).css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('corazonDrop').appendTo('#corazonDiv');f(g);g=null};var h=0;var j=0;$pdj(window).resize(function(){c=$pdj(window).width();d=$pdj(window).height()})});</script>

Por ultimo guardas los cambios y listo. Puedes ver el truco en este blog de pruebas.

Recuerda que el truco utiliza libreria jQuery asi que si no funciona ten en cuenta que se debe a la version que usas de jQuery.

0
Shares

Relacionados...

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

4 Comentarios

  1. Enero 3, 2014    

    Muy chulo,me viene de lujo para decorar hoy mi blog ya que es el cumple de mi Peke jeje Saludos!!

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Categorías

Síguenos en Facebook

Suscribete por Email

Introduce tu Correo:

Recibiras nuestros últimos posts en tu correo