11548 sujets

JavaScript, DOM et API Web HTML5

tout d'abord si cette question a déjà été traitée, désolé, mais ma recherche ne m'a renvoyé aucun résultat probant...

ensuite, étant nouveau sur ce forum, j'espère que je n'enfreindrai aucune règle de comportement du forum dans ce post (bah quoi vous lisez toujours toutes les docs et les contrats quand vous faites qqch ?)

bref, entrons dans le vif du sujet : j'aimerai récupérer la position du curseur de souris dans une page web en Javascript et ce sous Firefox, je sais logiquement il suffit de faire "e.pageY" et" e.pageX", mais cela ne fonctionne pas ou plus sous Firefox 1.0.6, donc si quelqu'un a remarquer ce bug et sait y palier, ça serait simpa de m'indiquer comment il fait ?????

(j'ai entre autres choses testé ce script : http://www.editeurjavascript.com/scripts/scripts_evenements_2_50.php

et il marche sous IE mais pas sous Firefox ... même s'il devrait ...

j'attends vos réponses

tant que j'y suis : peut-on en javascript toujours connaitre la largeur et la hauteur d'un TABLE html dont on a pas définit la taille (exemple TABLE remplie dynamiquement et dont le nombre de lignes change de par le fait) ???

merci d'avance

john Smiley cligne
Modifié par j_villebrun (08 Aug 2005 - 23:27)
j_villebrun a écrit :

(j'ai entre autres choses testé ce script : http://www.editeurjavascript.com/scripts/scripts_evenements_2_50.php


Berk, détection de navigateur, propriétés non standards, etc


function position(evt)
{
    if( !evt ) evt = window.event;
    var x = evt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft);
    var y = evt.clientY + (document.documentElement.scrollTop || document.body.scrollTop);
    window.status = "Souris X:"+x+" / Y:"+y;
}

document.onmousemove = position;


a écrit :
tant que j'y suis : peut-on en javascript toujours connaitre la largeur et la hauteur d'un TABLE html dont on a pas définit la taille (exemple TABLE remplie dynamiquement et dont le nombre de lignes change de par le fait) ???


var tabW = window.getComputedStyle(matable, null).width;
var tabH = window.getComputedStyle(matable, null).height;


Pour IE (sans garantie):

var tabW = matable.currentStyle.width;
var tabH = matable.currentStyle.height;
Bonjour,
Pour connaître la taille de n'importe quel élément bloc, et ce indifféremment sous firefox et sur IE :
document.getElementById("nom_element").offsetLeft et Top
QuentinC a écrit :
Bonjour,
Pour connaître la taille de n'importe quel élément bloc, et ce indifféremment sous firefox et sur IE :
document.getElementById("nom_element").offsetLeft et Top


Ça, c’est pour connaitre la distance du bloc par rapport aux bords supérieur et gauche de bloc parent (et sur Firefox, c’est bogué, ça donne la distance par rapport aux bords de BODY).

Je pense que tu voulais parler de offsetWidth et offsetHeight, propriétés qui ne sont pas normalisées (tout comme offsetLeft et offsetTop).
Bobe a écrit :


Ça, c’est pour connaitre la distance du bloc par rapport aux bords supérieur et gauche de bloc parent (et sur Firefox, c’est bogué, ça donne la distance par rapport aux bords de BODY).


<parenthèse>
je m'abuse lourdement, ou ce "bug" rappelle fortement le DHTML microsoft et le modèle du "layout" ?
</>
Laurent Denis a écrit :


<parenthèse>
je m'abuse lourdement, ou ce "bug" rappelle fortement le DHTML microsoft et le modèle du "layout" ?
</>


En fait, les propriétés offset* viennent originellement de l’API DOM de Microsoft. Concernant le modèle du layout, tu parles bien de ça:
http://www.satzansatz.de/cssd/onhavinglayout.html ?

Car je n’ai pas l’impression que ça ait un rapport donc si tu pouvais préciser ta pensée... Smiley biggrin
Modifié par Bobe (09 Aug 2005 - 15:18)
Bobe a écrit :


En fait, les propriétés offset* viennent originellement de l&#8217;API DOM de Microsoft.

Bon, pas encore mort, le vieux, alors Smiley smile
Bobe a écrit :

Concernant le modèle du layout, tu parles bien de ça:
http://www.satzansatz.de/cssd/onhavinglayout.html ?

Car je n&#8217;ai pas l&#8217;impression que ça ait un rapport donc si tu pouvais préciser ta pensée... Smiley biggrin

C'était une parenthèse, car cela n'avait effectivement aucun rapport... sauf précisément avec cet article précis et la difficulté de comprendre a posteriori ce fichu layout microsoft... D'où l'intérêt de ses émules concurrents Smiley cligne
Bien vu, en tous cas Smiley cligne
Modifié par Laurent Denis (09 Aug 2005 - 15:45)
donc merci pour réponses, en même temps, de mon côté, j'ai continué à taffer et j'ai également testé ce que vous proposiez, résultat :

pour disposer contament des coordonnées de la souris, tant sous IE que sous Firefox, une méthode simple est d'utiliser le code suivant :


function register_position(){
	mouse_x = 0;
	mouse_y = 0;
	document.onmousemove = position;
}

function position(evt){
	if(!evt) evt = window.event;	
	mouse_x = evt.clientX;
	mouse_y = evt.clientY;
}


ainsi que cela, pour initialiser le tout au chargement de la page :

<body onLoad="javascript:register_position()">


ensuite, pour ce qui est de la taille d'un élément, pour connaitre la taille d'un bloc (n'importe quel élément HTML dont le style DISPLAY est BLOCK), il faut utiliser sa propriété offsetHeight :
document.getElementById('ID_ELEMENT').offsetHeight;


voila, cela aidera peut etre quelqu'un d'autre ...

merci aux différents participants qui ont ajouté leur code, ça m'a aidé à trouver la solution Smiley cligne

++ john