Script Masters : Javascript : Index

Script Masters

Espace membre

Langages

Autres ressources

Emploi avec Jobintree

Ressources graphiques

Recherche

Kit graphique

Liens

Statistiques

Javascript >> Catégorie >> Graphisme >> Logo qui suit la souris

Description

Ce script vous permettra de placer un logo à proximité du curseur de la souris. Veillez toutefois à ce que celui-ci soit assez discret pour ne pas gêner la lisibilité. Consultez l’exemple pour visualiser l’effet rendu.

Exemple

[Cliquez ici pour visualiser l'exemple]

Informations et statistiques

Internet Explorer : 4+
Netscape Navigator : 4+
Auteur : inconnu
Date de création : inconnue
Date d'ajout : 28/11/2003

Visualiser : 22857
Dont aujourd'hui : 3
Envoi par mail : 268
Commentaire : 1 ( Voir )

Conseils pour la personalisation du script

Pensez à modifier les 3 premières variables qui sont :
- Le chemin du logo
- La largeur du logo
- La hauteur du logo

Le script

Insérer ce script entre les balises <Head> </Head>

/*
Insérer ce script entre les balises <Head> </Head>
*/

<SCRIPT LANGUAGE="JavaScript1.2">
image_used = "graphisme/logo_25x24.gif";   	//adresse de l'image
width_of_image = 25;	    				//largeur de l'image
height_of_image = 24;	    				//hauteur de l'image

//===============ne pas editer sous cette ligne================

ns4 = (document.layers)? true:false
  ie4 = (document.all)? true:false

function onerror() {
    location.href="javascript:"
    }
  function DynLayer(id,nestref) {
          if (ns4) {
                  this.css = (nestref)? eval("document."+nestref+".document."+id) : document.layers[id]
                  this.x = this.css.left
                  this.y = this.css.top
          }
          else if (ie4) {
                  this.css = document.all[id].style
                  this.x = this.css.pixelLeft
                  this.y = this.css.pixelTop
          }
          this.show = DynLayerShow
          this.hide = DynLayerHide
          this.addon = DynLayerAddon
          this.addon(id,nestref)
  }

function DynLayerMoveTo(x,y) {
          if (x!=null) {
                  this.x = x
                  this.css.left = this.x
          }
          if (y!=null) {
                  this.y = y
                  this.css.top = this.y
          }
  }
  function DynLayerMoveBy(x,y) {
          this.moveTo(this.x+x,this.y+y)
  }
  function DynLayerShow() {
          this.css.visibility = (ns4)? "show" : "visible"
  }
  function DynLayerHide() {
          this.css.visibility = (ns4)? "hide" : "hidden"
  }
  function DynLayerAddon(id,nestref) {
          this.id = id
          this.nestref = nestref
          this.w = (ns4)? this.css.clip.width : this.css.pixelWidth
          this.h = (ns4)? this.css.clip.height : this.css.pixelHeight
          this.doc = (ns4)? this.css.document : document
          this.event = (ns4)? this.css : document.all[id]
          this.obj = id + "DynLayer"
          eval(this.obj + "=this")
          this.moveTo = DynLayerMoveTo
          this.moveBy = DynLayerMoveBy
          this.slideTo = DynLayerSlideTo
          this.slideBy = DynLayerSlideBy
          this.slideStart = DynLayerSlideStart
          this.slide = DynLayerSlide
  }
  function DynLayerSlideTo(endx,endy,inc,speed,fn) {
          if (endx==null) endx = this.x
          if (endy==null) endy = this.y
          var distx = endx-this.x
          var disty = endy-this.y
          this.slideStart(endx,endy,distx,disty,inc,speed,fn)
  }
  function DynLayerSlideBy(distx,disty,inc,speed,fn) {
          var endx = this.x + distx
          var endy = this.y + disty
          this.slideStart(endx,endy,distx,disty,inc,speed,fn)
  }
  function DynLayerSlideStart(endx,endy,distx,disty,inc,speed,fn) {
          if (this.slideActive) return
          var num = Math.sqrt(Math.pow(distx,2) + Math.pow(disty,2))/inc
          var dx = distx/num
          var dy = disty/num
          if (!fn) fn = null
          this.slideActive = true
          this.slide(dx,dy,endx,endy,num,1,speed,fn)
  }
  function DynLayerSlide(dx,dy,endx,endy,num,i,speed,fn) {
          if (!this.slideActive) return
          if (i++ < num) {
                  this.moveBy(dx,dy)
                  setTimeout(this.obj+".slide("+dx+","+dy+","+endx+","+endy+","+num+","+i+","+speed+",\""+fn+"\")",speed)
          }
          else {
                  this.slideActive = false
                  this.moveTo(endx,endy)
                  eval(fn)
          }
  }

function init() {
    document.onmousemove = mouseMove
    if (ns4) document.captureEvents(Event.MOUSEMOVE)

createLayer("cursorDiv",null,-1*(width_of_image),-1*(height_of_image),width_of_image,height_of_image,"<IMG SRC=" + image_used + ">",null,null,0);
    cursor = new DynLayer("cursorDiv");
    }

function mouseMove(e) {
    var x = (ns4)? e.pageX : event.x
    var y = (ns4)? e.pageY : event.y+document.body.scrollTop
    cursor.moveTo(x+1,y+1);
    }
</SCRIPT>

Remplacer votre tag body par celui-ci

Recevoir ce script par email

Entrez votre email ci-dessous pour recevoir ce script dans votre boite à lettre

Poster un commentaires :

Plus d'info :

Un problème ? Consultez le forum de Script Masters pour trouver la réponse !