Banderas de tu país que caen y se desvanecen en el blog

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

Como estamos en el mes de julio, qué es la época en la que muchos países de América Latina alcanzaron su independencia, hoy quise hacer un pequeño gadget que consta de banderas de Colombia que van cayendo lentamente y se desvanecen a media que se acercan al final de la página.

Banderas de tu país que caen y se desvanecen en el blog..

COLOMBIAtRUCOS BLOGGER

Vista Previa del Truco

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

<script>
 /***** Banderas 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']="https://4.bp.blogspot.com/-4M2dBVQreBA/V3lx2yf9HUI/AAAAAAAAHd0/x8Vji8977_gaIpiG5eCTricvjgZsxSnmgCLcB/s1600/colombia-06.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>

En este caso yo he agregado la bandera de Colombia, pero puedes poner la de tu país con solo cambiar la línea que he resaltado en color azul.

Por último guardas los cambios y listo. Recuerda que el truco utiliza librería jQuery así que si no funciona ten en cuenta que se debe a la versión que usas de jQuery.

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

Deja un comentario

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