Webmatze.de  | Webmaster Forum

kannste mal nen bsp posten plz.
liegt evtl dadran, dass der container außerhalb des content sein muss

Das ist die Datei die includet wird.
<br />.news {<br /> border:#000000 1px dotted;<br /> margin-top:1px;<br /> width:398px;<br /> padding:3px;<br /> margin-bottom:15px;<br /> z-index:4;<br />}<br /><br /><div class="news"><br /><span style="color:#FF0000"><?php </span><br />echo '<div class="tooltip" id="' .$id . '"><img src="' . $vorschau . '" alt="" /></div>'; <br />echo '<a class="kategorien" href="' . 'index.php?id=' . $id . '" onMouseOver="showWMTT('. $id . ')" onMouseOut="hideWMTT()">' . $rows->titel . '</a>';<br /><span style="color:#FF0000">?></span><br /></div>

Der obenstehende Code wird in den Container .content includet
<br />.content {<br /> margin-left: 140px;<br /> padding-top: 5px;<br /> color:#000000;<br /> padding-right:0px;<br /> padding-left:0px;<br /> margin-right:0px;<br /> z-index:5; <br /> min-height: 685px; <br />}<br />

Ich füge nochmal den Link hinzu, wo ich das Problem habe: http://google.de unten in der Tabelle auf der Hauptseite.
Die Tooltips sind hier auf 1280x1024 optimiert, was gerade ja das Problem ist :(.

also ich denke es liegt daran, dass die tooltipp container innerhalb des containers "super" liegen.
dadurch kommt es zu kollisionen.

einfach mal die tooltipp container auf gleicher ebene wie den container "super" anlegen, ich denke dann geht es.
sollte das bei dir nicht ohne weiteres technisch machbar sein, so speicher die seite einfach mal statisch ab und bau es zum testet um, wenns geht kann ich dir eben nen paar zeilen js geben, mit der die tooltipp container geclont und auf der obersten ebene eingefügt werden.


und dann ersetzt auch nochmal das jezige js in js/functions.js gegen das hier (aktuelle version, die es hier irgendwo im forum gibt :D )
dir fallen sicher die 2 zeilen mehr auf xD

<br />wmtt = null;<br /> document.onmousemove = updateWMTT;<br /> <br /> function updateWMTT(e) {<br /> <br /> var scrTop = (document.documentElement && document.documentElement.scrollTop) ? document.documentElement.scrollTop : document.body.scrollTop;<br /> var scrLeft = (document.documentElement && document.documentElement.scrollLeft) ? document.documentElement.scrollLeft : document.body.scrollLeft;<br /> <br /> x = (document.all) ? window.event.x + scrLeft : e.pageX;<br /> y = (document.all) ? window.event.y + scrTop : e.pageY;<br /> <br /> if (wmtt != null) {<br /> wmtt.style.left = (x + 20) + "px";<br /> wmtt.style.top = (y +20) + "px";<br /> }<br /> }<br /><br /> function showWMTT(id) {<br /> wmtt = document.getElementById(id);<br /> wmtt.style.display = "block"<br /> }<br /> <br /> function hideWMTT() {<br /> wmtt.style.display = "none";<br /> }<br />

Vielen Dank soweit,
ich habe das Script aktualisiert und die Tooltip-Container nun, vor dem "Super"-Container gelegt (statisch), und siehe da es funktioniert einwandfrei!

Wie Du schon sagtest "nicht ohne weiteres technisch machbar", dass ist bei mir auch der Fall, unten diese Tabelle ("lastadd.php") wird in die "index.php" includiert.
Und in dieser ("lastadd.php") steht auch der Tooltip-Code.
Deswegen bräuchte ich nun die "paar zeilen js", damit ich das ganze vor ".super" clonen kann. :).

Gruß
Niko

jo ich machs dir mal morgen abend fertig, vorher hab ich leider 0 zeit

so also hie rmal die überarbeitete version des tooltipp scriptes.
es clont die jeweiligen tooltipp knoten direkt unterhalb des knotens.

der abstand des tooltipps wird bestimmt mit
tt_offset_x und t_offset_y

<br /> var body = null; <br /> var tt_container = null;<br /> var tt_last = null;<br /> var tt_visible = false;<br /> var tt_x = 0;<br /> var tt_y = 0; <br /> <br /> var tt_offset_x = 20;<br /> var tt_offset_y = 20;<br /> <br /> function updateWMTT(e){ <br /> var scrTop = (document.documentElement && document.documentElement.scrollTop) ? document.documentElement.scrollTop : document.body.scrollTop;<br /> var scrLeft = (document.documentElement && document.documentElement.scrollLeft) ? document.documentElement.scrollLeft : document.body.scrollLeft;<br /> <br /> tt_x = (document.all) ? window.event.x + scrLeft : e.pageX;<br /> tt_y = (document.all) ? window.event.y + scrTop : e.pageY;<br /> <br /> if (tt_container != null && tt_visible){<br /> tt_container.style.left = (tt_x + tt_offset_x) + "px";<br /> tt_container.style.top = (tt_y + tt_offset_y) + "px";<br /> }<br /> }<br /> <br /> function showWMTT(id){<br /> if (id != tt_last){<br /> if (body != null && tt_container != null){<br /> body.removeChild(tt_container);<br /> }<br /> <br /> var orig_node = document.getElementById(id);<br /> tt_container = orig_node.cloneNode(true); <br /> body.appendChild(tt_container);<br /> tt_last = id;<br /> <br /> } <br /> tt_visible = true;<br /> // 4 IE...<br /> tt_container.style.left = (tt_x + tt_offset_x) + "px";<br /> tt_container.style.top = (tt_y + tt_offset_y) + "px";<br /> tt_container.style.display = "block"; <br /> }<br /> <br /> function hideWMTT() {<br /> tt_container.style.display = "none";<br /> tt_visible = false; <br /> }<br /><br /> function init(){<br /> body = document.getElementsByTagName('body')[0];<br /> }<br /> <br /> document.onmousemove = updateWMTT;<br /> window.onload = init;<br /><br />

das soltle eigtl bei dir dann gehen, habs nur mitm FF 2.0.0.4 und IE7 getestet

Vielen vielen Dank, es funktioniert Perfekt.

Und nochmals Danke, für den Aufwand und die damit verbunde Arbeit!

Gruß
Niko

Ich habe gerade leider einen Bug entdeckt, der beim Originalscript nicht vorhanden ist.
Und zwar, wenn man die Site nicht komplett ausladen lassen hat, und schon vorher auf den Tooltip-Container hovert, dann erscheinen keine Grafiken mehr d.h. keine Tooltips.
Erst nach einem Reload.

Ich hoffe du kannst mir da weiter helfen.

Gruß
Niko

jop mach ich dir gleichmal, dazu fehlt noch ne abfrage

glaub so ist das besser :)

<br />var body = null;<br />var tt_container = null;<br />var tt_last = null;<br />var tt_visible = false;<br />var tt_x = 0;<br />var tt_y = 0;<br /><br />var tt_offset_x = 20;<br />var tt_offset_y = 20;<br /><br />function updateWMTT(e){<br />var scrTop = (document.documentElement && document.documentElement.scrollTop) ? document.documentElement.scrollTop : document.body.scrollTop;<br />var scrLeft = (document.documentElement && document.documentElement.scrollLeft) ? document.documentElement.scrollLeft : document.body.scrollLeft;<br /><br />tt_x = (document.all) ? window.event.x + scrLeft : e.pageX;<br />tt_y = (document.all) ? window.event.y + scrTop : e.pageY;<br /><br />if (tt_container != null && tt_visible){<br />tt_container.style.left = (tt_x + tt_offset_x) + "px";<br />tt_container.style.top = (tt_y + tt_offset_y) + "px";<br />}<br />}<br /><br />function showWMTT(id){<br />if (id != tt_last){<br />body = document.getElementsByTagName('body')[0];<br />if (body != null && tt_container != null){<br />body.removeChild(tt_container);<br />}<br /><br />var orig_node = document.getElementById(id);<br />tt_container = orig_node.cloneNode(true);<br />body.appendChild(tt_container);<br />tt_last = id;<br /><br />}<br />tt_visible = true;<br />// 4 IE...<br />tt_container.style.left = (tt_x + tt_offset_x) + "px";<br />tt_container.style.top = (tt_y + tt_offset_y) + "px";<br />tt_container.style.display = "block";<br />}<br /><br />function hideWMTT() {<br />tt_container.style.display = "none";<br />tt_visible = false;<br />}<br /><br /><br />document.onmousemove = updateWMTT;<br />

Jetzt funktioniert es super.
Man was würde ich bloss ohne Dich machen :)!
Nochmals vielen vielen Dank.