Erhalte Bildschirmkoordinaten des DOM-Elements

8

Kann ich irgendwie genaue Bildschirmkoordinaten (relativ zur oberen linken Ecke des Bildschirms) eines DOM-Objekts erhalten? Durch NPAPI \ FireBreath oder JavaScript. (Brauche das für das Plugin, das ich schreibe mit FeuerBreath)

    
Max Yari 29.03.2013, 12:51
quelle

3 Antworten

1

Sie bewegen den Cursor an eine beliebige Stelle der Seite und machen ein click -Ereignis (suchen Sie das Fenster, dann GetWindowRect, berechnen Sie eine geeignete Position), dann können Sie das Ereignis abfangen, clientX und clientY aufzeichnen. Dadurch erstellen Sie eine Brücke zwischen zwei verschiedenen Koordinatensystemen.

    
Jason Zheng 10.02.2017, 06:39
quelle
5

Ich weiß, dass Sie jQuery nicht erwähnt haben, aber Sie können Ссылка als Beispiel verwenden. Es kombiniert die offsetLeft/top aller Eltern und Konten für das Scrollen und gibt Ihnen ein genaues x, y (in Bezug auf den Körper) für verschachtelte Knoten.

Beachten Sie, dass das Ereignisobjekt bei Verwendung von Ereignissen immer über Ссылка informiert, wo das Ereignis aufgetreten ist Ссылка

Auch hier ist die Erwähnung von jQuery nur zur Inspiration, wenn Sie es nicht verwenden wollen.

Hier ist, wie jQuery es macht

%Vor%     
Juan Mendes 29.03.2013 16:09
quelle
5

PS .: Ich weiß, dass ich diese Frage schon lange gestellt habe, aber ich möchte zusammenfassen, was ich am Ende bekommen habe.

element.offsetLeft\Top funktioniert nicht so, wie es gemeint war.
Aus dem HTML-Code können Sie Koordinaten beziehen, relativ zur oberen linken Ecke des Seitenbereichs, nicht den Benutzerbildschirm selbst.

Und von plugin, durch GetWindowRect() winAPI Funktion können Sie Koordinaten der oberen linken Ecke des Browserfensters relativ zum Benutzerbildschirm erhalten, und durch GetClientRect() können Sie die Koordinaten der oberen linken Ecke des Client-Rechtecks ​​erhalten.

ABER, es ist nicht der gleiche Punkt wie oben links auf der Seite, es gibt immer etwas zwischen der Ecke des Seitenraums und dem Client-Rect oder Fenster-Rect. Es enthält Top-Browser-Bars und andere Sachen.

Was können Sie tun? Es scheint, dass es keinen einfachen 100% beherrschbaren Weg gibt:

Sie können versuchen, diese Browser-Balken zu berücksichtigen und den Abstand zwischen Client rect und dem Rechteck der Seite zu berechnen, aber diese Browser-Balken sind nicht von Benutzer zu Benutzer konstant, einer kann mehr davon haben, der andere und Sie erhalten alle Ihren Koordinatensystem vermasselt. Dann können Sie irgendwie die Anzahl der installierten Balken und Additionen im Browser registrieren, und entsprechend berechnen Sie die Menge an Speicherplatz, die von ihnen verbraucht wird, aber Bars und Ergänzungen nicht die gleichen, und wieder haben Sie zu viele Variablen zu berücksichtigen .

Es gibt ein wenig einfacher Weg, Sie können nicht von oben gehen, aber von unten - erhalten Sie die Koordinaten des unteren Punktes von rect und durch einige Berechnungen mit HTML element.offset - binden Sie Ihr Koordinatensystem an den unteren linken Punkt von das Fenster.
 Sie haben keine Benutzer-Browser-Balken am unteren Rand und können daher etwas sicherer im Abstand zwischen Seiten- und Fenster-Ecke sein, aber einige Browser haben Pop-up-Balken mit Download-Informationen usw., und hier haben wir alles wieder vermasselt / p>

Eine weitere Option ist die Verwendung von modalen Fenstern - dh die Seite im modalen Fenster wird durch window.open() von Ihrem JavaScript geöffnet, Sie können die Anzahl der Browsersteuerelemente und Balken in diesen Fenstern steuern, Sie können all diese Benutzerleisten loswerden und ein Fenster nur mit Adressleiste und der Seite löschen. Jetzt haben Sie viel mehr Kontrolle und können fast sicher sein, dass dieser Abstand zwischen den Ecken für alle Ihre Benutzer gleich ist ... fast.
Es gibt zwei Dinge, die erwähnt werden müssen:

1) Einige Browser (zB google chrome, wie ich mich erinnere) haben diese benutzerdefinierten Browser-Zusätze (Firebug zum Beispiel) als kleine Icons neben der Adressleiste erscheinen lassen, und sie erscheinen immer noch in der Nähe der Adressleiste des modalen Fensters.
Was ist das für ein Unterschied, der Unterschied besteht darin, dass aus irgendeinem Grund der obere Teil des Browserfensters um 5 Pixel fetter wird, wenn es sogar eines dieser Icons gibt (auch hier können Sie versuchen, sich zu registrieren, gibt es davon irgendwelche im Benutzerbrowser installiert oder nicht)
Und wenn diese 5px sowieso nicht entscheidend für dich sind - kann es ein Weg sein ... wenn du in Ordnung bist mit dem nächsten Ding.

2) Offensichtlicher - der Spaß mit modalen Fenstern kann für den Endbenutzer unangenehm sein, weil er einige Browsereinstellungen und -mechanismen einschränkt, an die sich die Benutzer des Browsers gewöhnen.

    
Max Yari 22.01.2014 05:11
quelle