Moin,
in HTML-Seiten habe ich ein absolut positioniertes Feld, das mit Text aus der Datenbank gefüllt wird und aufpoppt, wenn ich ein Help-Symbol anklicke.
Ich werte die x- und y- position des Mauszeigers aus und setze left und top in px.
Help-Symbole nahe des rechten Fensterrands führen dazu, dass das Help-Feld auswandert. Da möchte ich das Feld dann nach links aufklappen lassen, aber wie setze ich die Angabe für left ausser Kraft?
div#helptext {
position: absolute;
display: none;
left: 5px;
width: 25em;
top: 5px;
min-height: 5em;
background-color: #ffc;
border: .1pt solid #f00;
border-radius: 4px;
padding: 5px;
z-index: 5;
}
<body>
<div id="helptext" onclick="this.style.display='none'"></div>
...
// Helpfeld auf Klickposition positionieren
if ( x > window.innerWidth /2 ) {
document.getElementById( "helptext" ).style.left = "";
document.getElementById( "helptext" ).style.right = (window.scrollX +x -5) +"px";
} else {
document.getElementById( "helptext" ).style.left = (window.scrollX +x +5) +"px";
document.getElementById( "helptext" ).style.right = "";
}
...
Nun "klebt" das nach links ausgeklappte Feld am linken Festerrand, als ob ich .left = "0" angegeben hätte. Auch .left ="auto" und .left = "inherit" führten nicht dazu, dass das Feld horizontal am Cursor hängt.
Linuchs