Bonsoir tout le monde,
je développe un petit script en javascript (sans framework, c'est obligatoire, donc pas de jQuery ni autre).
Je cherche à obtenir la position X et Y d'une \<img >.
pour ca j'utilise une fonction getPos(el) récupérer du bookmarklet de pinterest : https://github.com/pinterest/widgets/blob/master/pinit_main.js
// get the natural position of an element
getPos: function (el) {
var html, marginTop, paddingTop, marginLeft, paddingLeft;
var x = 0, y = 0;
if (el.offsetParent) {
do {
x = x + el.offsetLeft;
y = y + el.offsetTop;
} while (el = el.offsetParent);
// add padding or margin set to the HTML element - fixes Wordpress admin toolbar
if (!$.v.hazIE) {
var html = $.d.getElementsByTagName('HTML')[0];
var marginTop = $.f.getStyle(html, "margin-top", true) || 0;
var paddingTop = $.f.getStyle(html, "padding-top", true) || 0;
var marginLeft = $.f.getStyle(html, "margin-left", true) || 0;
var paddingLeft = $.f.getStyle(html, "padding-left", true) || 0;
x = x + (marginLeft + paddingLeft);
y = y + (marginTop + paddingTop);
}
return {"left": x, "top": y};
}
}
Ca marche très bien sauf quand un des parents à un display = "none".
Comme expliquer ici ( https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetParent ) .offsetParent renvoie 'null'
Auriez vous une solution pour obtenir les coordonnées d'un élément invisible ?
J'ai pas mal cherché sur google, stackoverflow et autres sans succès...
Bon ca n'avance pas beaucoup...
J'ai voulu tester une méthode qui consiste à passer toute la chaine de parent en visible,
Donc je boucle sur chque parent en stockant l'état du display initial, puis je le passe en '' ou en block.
Quant j'ai fait ca avec tous les parents, je récupère la position X,Y de l'enfant.
Puis je repasse tous les parents dans leur état de display d'origine.
Mais j'obtiens des valeurs incohérentes, car tout passer en block ou en '' fait péter la mise en page...
Personne ne joue avec les positions X,Y des élements ? une idées ? une piste, quelque chose :)