• Une image qui suit le curseur sur votre blog !

    Un petit tuto pour vous expliquer comment faire suivre votre curseur par une image !

     N'oubliez pas d'activer le javacript ! 

     

    Si vous souhaitez utiliser la même image sur tout votre blog, créez un module simple et cliquez sur < > et collez le code ci-dessous en changeant évidement l'url.

    Si vous souhaite ne mettre une image que sur une page, cliquez sur "Editer" de l'en tête, cliquez sur < > et collez ce code le code suivant en mettant l'url de votre image.

     

    Voici le code :

     code<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Image qui suit la souris</title>
    <script type="text/javascript">
    //<!--
    document.onmousemove = suitsouris;
    function suitsouris(evenement)
    {
    if(navigator.appName=="Microsoft Internet Explorer")
    {
    var x = event.x+document.body.scrollLeft;
    var y = event.y+document.body.scrollTop;
    }
    else
    {
    var x = evenement.pageX;
    var y = evenement.pageY;
    }
    document.getElementById("image_suit_souris").style.left = (x+1)+'px';
    document.getElementById("image_suit_souris").style.top = (y+1)+'px';
    }
    //-->
    </script>
    </head>
    <body>
    <img src="image.png" alt="suivi du curseur" id="image_qui_suit_curseur" style="position:absolute;display:block;z-index:5;" />
    </body>

     

    Changer image.png par l'url de l'image que vous souhaitez utiliser pour suivre votre curseur  !