29 enero 2012

Corazones flotando en el blog por San Valentin.

Como ya estamos casi a la vuelta de San Valentin, fecha en la que todos estamos predispuestos a dejarnos llevar por ese espíritu romántico, enamoradizo y aventurero, y como siempre tratamos de aprovechar casi cualquier medio para poder expresar ese sentimiento hacia nuestro ser querido, he aprovechado la oportunidad para traerles este sencillo y divertido –y expresivo también- gadget de corazones para poder ponerlo en el blog y así inundar de romanticismo nuestros posts; y como el corazón es el símbolo del amor, pues que mejor manera de expresar lo que sentimos si no es llenando nuestras entradas con corazones... !en toda nuestra pantalla...¡

Puedes ver un ejemplo de esto en este Demo.

Ponerlo en el blog es muy sencillo, entra a Diseño, Añadir Gadget, Html-javascript, y copia el siguiente código:

 <script language='javascript' type='text/javascript'>
//<![CDATA[
// Script original de Eloi Gallés Villaplana

var numero =25
var velocidad = 20
var imagenamor = "https://lh4.googleusercontent.com/-_DubFGB9694/TyjSYMzn48I/AAAAAAAAAIo/fQ4ArWbipE8/s40/corazon.gif"

var ns4arriba = (document.layers) ? 1 : 0
var ie4arriba = (document.all) ? 1 : 0
var dombrowser = (document.getElementById) ? 1 : 0

var dx, xp, yp
var am, stx, sty
var i, doc_ancho = 1024, doc_alto = 768

function amor() {

    establece_dimensiones()

    dx = new Array()
    xp = new Array()
    yp = new Array()
    am = new Array()
    stx = new Array()
    sty = new Array();
     
    for (i = 0; i < numero; ++ i) {
        dx[i] = 0
        xp[i] = Math.random()*(doc_ancho-50)
        yp[i] = Math.random()*doc_alto
        am[i] = Math.random()*20
        stx[i] = 0.02 + Math.random()/10
        sty[i] = 0.7 + Math.random()
        if (document.layers) {
                 if (i == 0) {
                document.write("<layer name=\"dot"+ i +"\" left=\"15\" ")
                document.write("top=\"15\" visibility=\"show\"><img src=\"")
                document.write(imagenamor + "\" border=\"0\"></layer>")
                 } else {
                     document.write("<layer name=\"dot"+ i +"\" left=\"15\" ")
                     document.write("top=\"15\" visibility=\"show\"><img src=\"")
                     document.write(imagenamor + "\" border=\"0\"></layer>")
                 }
             } else if (document.all || document.getElementById) {
                 if (i == 0) {
                     document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ")
                     document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ")
                     document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"")
                     document.write(imagenamor + "\" border=\"0\"></div>")
                 } else {
                     document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ")
                     document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ")
                     document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"")
                     document.write(imagenamor + "\" border=\"0\"></div>")
                 }
             }
     }
     
    corazon()
}

function corazon() {
    for (i = 0; i < numero; ++ i) {
        yp[i] += sty[i];
        if (yp[i] > doc_alto) {
            xp[i] = Math.random()*(doc_ancho-am[i]-30)
            yp[i] = 0
            stx[i] = 0.02 + Math.random()/10
            sty[i] = 0.7 + Math.random()
            establece_dimensiones()
        }

        dx[i] += stx[i];

        
        if ( document.all ) {
            var imagen = eval("dot" + i )
            imagen.style.posLeft = xp[i] + am[i]*Math.sin(dx[i])
            imagen.style.posTop = yp[i]
        }
        
        else if ( document.layers ) {
            var imagen = eval("document.dot" + i)
            imagen.left = xp[i] + am[i]*Math.sin(dx[i])
            imagen.top = yp[i]
        }
        
        else if ( document.getElementById ) {
            var imagen = document.getElementById( "dot" + i)
            imagen.style.left = xp[i] + am[i]*Math.sin(dx[i]) + 'px'
            imagen.style.top = yp[i] + 'px'
        }
    }

    setTimeout("corazon()", velocidad)
}
function establece_dimensiones() {
    if (self.innerHeight) {
        doc_ancho = self.innerWidth - 50
        doc_alto = self.innerHeight - 21
    } else if (document.documentElement && document.documentElement.clientHeight) {
        doc_ancho = document.documentElement.clientWidth
        doc_alto = document.documentElement.clientHeight - 25
    
    } else if (document.body) {
        doc_ancho = document.body.clientWidth
        doc_alto = document.body.clientHeight - 25
    }
}
//]]>
</script>
<script language='javascript' type='text/javascript'>
amor()
</script>

Este código ha sido modificado del original de Eloy Gallés, e igual puedes cambiar la imagen del corazón por una que prefieres, solo tienes que cambiar donde dice  https://lh4.googleusercontent.com/-_DubFGB9694/TyjSYMzn48I/AAAAAAAAAIo/fQ4ArWbipE8/s40/corazon.gif por la url de tu imagen. Aquí yo he utilizado una imagen de gifmania.

No hay comentarios:

Publicar un comentario

Copia lo que quieras. Si crees que valió la pena, menciona este blog.

BLOGER & BLOGER ® 2020 | Plantilla Adaptada y Rediseñada Por Bloger & Bloger