Mauszeiger und Fensterhälfte

Smoothi

Bekanntes Mitglied
Nun hab ich mal eine Frage zu JavaScript ;)

Wie kann ich prüfen, ob sich der Mauszeiger in der linken oder rechten Browserfensterhälfte befindet?

Ich möchte eine kleine Infobox bei Mouseover anzeigen lassen...jedoch sind manche Buttons zu weit am rechten Rand, sodass diese verschwinden.

Alternativ wäre es noch günstig eine Abfrage zu machen, ob sich der Mauszeiger in einer bestimmten Position zum rechten Rand befindet.

Weiß noch nicht genau wie ich es umsetzen möchte. Entweder in 2 Hälften aufteilen oder die Box nur rechtsbündig anzeigen, wenn es verschwinden würde. ;)
 

Smoothi

Bekanntes Mitglied
erstmal Danke....wobei ich das im Nachhinein garnicht benötigte ;)

Habe es nun etwas anders gelöst... anstatt mit der Mausposition, mit der Position des Objekts wo der Mouseover aufgerufen wird... Das war im Endeffekt günstiger

Was mir nun noch Fehlt ist das Auslesen der Objektgröße

document.getElementById("info_box").style.width
document.getElementById("info_box").offsetWidth

beim ersten kommt nichts dabei raus...beim zweiten 0,
obwohl ich in meiner CSS-Datei bei #info_box {... width = 100px gesetzt habe.

Bin nicht so versiert in JavaScript ;)
 

Smoothi

Bekanntes Mitglied
Nu das was da steht habe ich doch gemacht. ;)

document.getElementById("info_box").style.getAttribute("width", false);
oder
document.all.info_box.style.getAttribute("width", false);

ergibt auch nur "null" :/
 

Evil-Devil

Top Contributor
Existiert ein Element mit der ID info_box oder existieren vielleicht mehrere?

Im allgemeinen ist es empfehlenswert die Arbeit von Frameworks wie Prototype oder jQuery machen zu lassen und nur noch auf deren Eigenschaften zu arbeiten. Das erspart einem nicht nur Nerven sondern auch die vielen Browser spezifischen Fallstricke.
 

HimBromBeere

Top Contributor
Java:
document.getElementById("info_box").style.getAttribute("width", false);
Das kann ja auch nix werden...
Code:
width
kann weder den Wert
Code:
false
bekommen, noch kann man sein Attribut über einen getter setzen...
 

Smoothi

Bekanntes Mitglied
@HimBromBeere
ja ich habe es auch ohne FALSE probiert ;)

Ich möchte den Wert ja auch nicht setzen, sondern nur auslesen, von daher ist der Getter schon richtig. Ich möchte, wie gesagt, einfach nur den Width-Wert auslesen, den ich in der CSS-Datei für meine info_box angegeben hab.

Ich hab nur die aufgerufene Funktion angegeben...natürlich sollte das Ergebnis des Getters in eine Variable gespeichert werden. ;) Aber die Breite eines Objekts sollte doch auslesbar sein.

Zumal es an einer anderen Stelle ja auch funktioniert, da übergebe ich das Objekt aber mittels "this".

Code:
object.offsetWidth;

Das klappt auch wunderbar. Jedoch funktioniert es nicht, wenn ich das Objekt mittels ID hole.

Code:
document.getElementById("info_box")

@Evil-Devil
ja es existiert genau eine "info_box" ;)

Leider habe ich keine Zeit mehr, um mich mit JQuery zu beschäftigen. :( Ist aber vermutlich auch nicht nötig, da ich nur 4-5 kleine JavaScript-Methoden habe.

Derzeit habe ich den Wert per Hand reingeschrieben, jedoch möchte ich etwas Freiheit, falls man ein Objekt in der CSS-Datei etwas in seinen Abmaßen ändert
 

HimBromBeere

Top Contributor
Lass dir mal irgendwie alle beteiligten Objekte ausgeben (z.B. über alert(document.getElementById('info_box')), wenn irgendwann nur noch eine null-Ausgabe gemacht wirst, findest du´s evtl. besser, so auf Anhieb kann ich jedenfalls nichts Prekäres erkenne.
 

Smoothi

Bekanntes Mitglied
Habe nun mehrere Alerts in der Funktion verteilt.

Ich kann garkeine CSS-Variable auslesen... Schreiben klappt aber.

Jedoch habe ich eine Lösung gefunden:
Code:
document.getElementById("info_box").style.display = "block";
var infoWidth = document.getElementById("info_box").offsetWidth;

Wenn ich das Objekt vorher sichtbar setze (ist standardmäßig invisible), dann bekomm ich die richtige Breite auch über offsetWidth.
 

Smoothi

Bekanntes Mitglied
Naja...es war ja nur display: none;
Also nur nicht sichtbar, das Objekt selbst war jedoch da.

style.width geht nach wie vor nicht :/
 
Ähnliche Java Themen
  Titel Forum Antworten Datum
J Mauszeiger ändern! Angular, React, JQuery - Fragen zu JavaScript 12

Ähnliche Java Themen

Neue Themen


Oben