Soyez le premier à donner votre avis sur cette source.
Vue 6 284 fois - Téléchargée 434 fois
// Déclaration des variables globales // Tableau associatif qui contiendra les résultats des calculs var posMouse = {'xWindow':0, 'yWindow':0, 'wWindow':0, 'hWindow':0, 'xPage':0, 'yPage':0, 'wPage':0, 'hPage':0, 'message':""}; var objDivPosMouse; // Objet div contenant les coordonnées _optionViewPosMouse = true; // Type d'affichage de la div des coordonnées _displayPosMouse = true; // Affichage ou non de la div des coordonnées _displayStatBarPosMouse = false; // Affichage des coordonnées dans la barre de statut (IE) _statutBarCleared = true // Flag pour définir si le statut barre est déjà effacé var ie = document.all ? true : false; // Détection du navigateur IE // Récupération des valeurs dans le tableau associatif posMouse function getPosMouse(e) { if (!e) { e = window.event; } // Coordonnées de la souris dans la fenêtre (window), // quelque soit la position de l'ascenseur if (e.x != null && e.y != null) { posMouse.xWindow = e.x; posMouse.yWindow = e.y; } if (e.clientX != null && e.clientY != null) { posMouse.xWindow = e.clientX; posMouse.yWindow = e.clientY; } // Coordonnées de la souris dans la page, // avec calcul de la position de l'ascenseur if (e.pageX || e.pageY) { posMouse.xPage = e.pageX; posMouse.yPage = e.pageY; } if (e.clientX || e.clientY) { posMouse.xPage = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; posMouse.yPage = e.clientY + document.body.scrollTop + document.documentElement.scrollTop; } // Taille de la fenêtre getClientSize(); // Taille de la page posMouse.wPage = document.body.offsetWidth; posMouse.hPage = document.body.offsetHeight; } function getClientSize(){ // Netscape ou Firefox if (typeof window.innerWidth == 'number') { posMouse.wWindow = window.innerWidth; posMouse.hWindow = window.innerHeight; } // IE avec DTD valide else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) { posMouse.wWindow = document.documentElement.clientWidth; posMouse.hWindow = document.documentElement.clientHeight; } // IE avec DTD non valide else if (document.body && (document.body.clientWidth || document.body.clientHeight)) { posMouse.wWindow = document.body.clientWidth; posMouse.hWindow = document.body.clientHeight; } // Sinon else { posMouse.wWindow = -1; posMouse.hWindow = -1; } } // Affichage à l'écran des coordonnées de la souris function showPosMouse(e) { var xDiv = 0, yDiv = 0, wDiv = 0, hDiv = 0, message = ""; // Création de la div qui contiendra les données var objDiv = createDivPosMouse("divPosMouse"); objDivPosMouse = objDiv; // Récupération des coordonnées de la souris getPosMouse(e); // Ecriture dans la barre de statut (IE) if (_displayStatBarPosMouse) { if (posMouse.message != "") {message = " " + posMouse.message}; window.defaultStatus = "Window: X = " + posMouse.xWindow + " Y = " + posMouse.yWindow + " L = " + posMouse.wWindow + " H = " + posMouse.hWindow + " - Page: X = " + posMouse.xPage + " Y = " + posMouse.yPage + " L = " + posMouse.wPage + " H = " + posMouse.hPage + message; _statutBarCleared = false; } else { if (!_statutBarCleared) { window.defaultStatus = ""; _statutBarCleared = true; } } // Différents tests pour vérifier si on affiche ou non les coordonnées if (_displayPosMouse) { objDiv.style.display = "block"; } else { objDiv.style.display = "none"; return; } // Ecriture dans une div qui suit la souris if (posMouse.message != "") {message = "<br />" + posMouse.message}; objDiv.innerHTML = "Window: X = " + posMouse.xWindow + " Y = " + posMouse.yWindow + " L = " + posMouse.wWindow + " H = " + posMouse.hWindow + "<br />" + "Page: X = " + posMouse.xPage + " Y = " + posMouse.yPage + " L = " + posMouse.wPage + " H = " + posMouse.hPage + message; // Largeur et hauteur de la div (pour éviter les dépassements d'écran) wDiv = parseInt(objDiv.offsetWidth, 10) + 2; hDiv = parseInt(objDiv.offsetHeight, 10); // Calcul des coordonnées X et Y de la div // Décalage de l'affichage par rapport à la souris var offsetX = 10, offsetY = 10 ; xDiv = posMouse.xPage + offsetX; yDiv = posMouse.yPage + offsetY; if (_optionViewPosMouse) { // La div tourne autour de la souris en fonction de sa position sur l'écran if (posMouse.xWindow > (posMouse.wWindow / 2)) { xDiv = posMouse.xPage - wDiv - offsetX; } if (posMouse.xWindow >= posMouse.wPage) { xDiv = posMouse.wpage - wDiv; } if (posMouse.yWindow > posMouse.hWindow / 2) { yDiv = posMouse.yPage - hDiv - offsetY; } if (posMouse.yWindow >= posMouse.hWindow - 20) { yDiv = posMouse.hpage - hDiv - 0; } } else { // La div reste en bas à droite de la souris mais ne sort pas de l'écran var wMax = posMouse.wWindow - 20; // On supprime éventuellement le scrollbar vertical var hMax = posMouse.hWindow - 20; // On supprime éventuellement le scrollbar horizontal if (posMouse.xWindow + wDiv + offsetX > wMax) { xDiv = posMouse.xPage - (posMouse.xWindow + wDiv - wMax); } if (posMouse.yWindow + hDiv + offsetY > hMax) { yDiv -= (posMouse.yWindow + hDiv - hMax + offsetY); } } if (xDiv < 0) { xDiv = 0 }; if (yDiv < 0) { yDiv = 0 }; // Positionnement de la div en X et Y objDiv.style.left = xDiv + "px"; objDiv.style.top = yDiv + "px"; } // Création de la div affichant les coordonnées de la sousis function createDivPosMouse(idDiv) { if (document.getElementById(idDiv) == null) { var objDiv = document.createElement('div'); objDiv.setAttribute('id', idDiv); document.body.appendChild(objDiv); objDiv.style.display = "none"; objDiv.style.left = "0px"; objDiv.style.top = "0px"; // A définir en CSS par l'utilisateur //objDiv.style.position = "absolute" ; //objDiv.style.margin = "0"; //objDiv.style.padding = "2px 10px 2px 10px"; /* top right bottom left */ //objDiv.style.width = "300px"; //objDiv.style.background = "black"; //objDiv.style.color = "white"; //objDiv.style.border = "#FF0000 1px solid"; //objDiv.style.textAlign = "left"; //objDiv.style.fontSize = "12px"; //objDiv.style.fontWeight = "bold"; //objDiv.style.zIndex = "1000"; } return document.getElementById(idDiv); } // Swap entre les 2 types d'affichage de la div des coordonnées si pas de paramètre ou forçage (true ou flase) function swapViewPosMouse(_option) { _optionViewPosMouse = (typeof _option != 'undefined') ? _option : !_optionViewPosMouse; } // Swap entre l'affichage des coordonnées si pas de paramètre ou forçage (true ou flase) function displayPosMouse(_option) { _displayPosMouse = (typeof _option != 'undefined') ? _option : !_displayPosMouse; } // Swap entre l'affichage des coordonnées dans la barre de statut si pas de paramètre ou forçage (true ou flase) function displayStatBarPosMouse(_option) { _displayStatBarPosMouse = (typeof _option != 'undefined') ? _option : !_displayStatBarPosMouse; } // Swap entre la position abolute ou static de la div si pas de paramètre ou forçage (true ou flase) function absolutePosMouse(_option) { if (typeof _option != 'undefined') { objDivPosMouse.style.position = _option ? "absolute" : "static"; } else { objDivPosMouse.style.position = (objDivPosMouse.style.position == "absolute" || objDivPosMouse.style.position == "") ? "static" : "absolute"; } } // Affichage d'un message dans la div après les coordonnées de la souris // (utile en phase de test pour éviter les alert() qui bloquent le déroulement) function setMessagePosMouse(message) { posMouse.message = message; }
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.