lunes, 22 de octubre de 2012

angeles que caen y se desvanecen en blog

semana santa en muchos paises catolicos como el mio y habra algunos que querran poner su blog a tono con la epoca por lo que hoy traigo un truco en el cual se muestran unos lindos angelitos que van cayendo lentamente hasta desvanecerse.

El angelito que se muestra en el truco es el siguiente:




 Para agregar este truco ve  a Diseño | Añadir un gadget | HTML/Javascript y alli pegas lo siguiente:
 <script>
    /***** Angeles 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.100pies.net/Gifs/Religion/Angeles/Angel-05.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.

No hay comentarios:

Publicar un comentario