✔ das erscheinende mouseover-bild positionieren

[dog_marley]

hi leute,

nach 6 std ausprobieren und 2 std suchen , frag ich nun einfach mal:

habe ein javascript eingebaut um ein vergrößetes bild mit mouseover
über dem kleinen zu zeigen:

<script language="JavaScript" type="text/javascript">
    
    var wmtt = null;


    document.onmousemove = updateWMTT;

    function updateWMTT(e)
    {
        x = (document.all) ? window.event.x + document.body.scrollLeft : e.pageX;
        y = (document.all) ? window.event.y + document.body.scrollTop  : e.pageY;
        if (wmtt != null)
        {
            wmtt.style.left = (x + 10) + "px";
            wmtt.style.top = (y + 10) + "px";
        }
    }

    function showWMTT(id)
    {
        wmtt = document.getElementById(id);
        wmtt.style.display = "block"
    }

    function hideWMTT()
    {
        wmtt.style.display = "none";
    }

</script>

das PROBLEM ist hierbei, dass ja alle popup-bilder immer an der gleichen position
neben der maus auftauchen. also beim bild am rechten rand das mouseover
abgeschnitten wird

frage nun:gibt es eine möglichkeit, die position neben dem mousezeiger fest zu legen,
oder weiss jemand eine entsprechende alternative ?

mit layern ging auch nicht so richtig, da ie, firefox +chrome das mouseover immer
an anderen stellen zeigt, warum auch immer :-S

würd mich so sehr freuen, wenn mir weiteres, tagelanges suchen,ausprobieren
und fluchen erspart bliebe.

danke, gruß

 

[CPoly]

Erstmal Willkommen im Forum.

Gewöhne dir für die Zukunft an deinen Code in die entsprechenden code Tags zu setzen. z.B. [code=javascript][code=javascript], [code=html][/code], [code=css][/code], [code=csharp][/code] oder auch alg. [code][/code]

Außerdem ist es bei solchen Fragen immer sehr hilfreich das ganze online zur Verfügung zu stellen. Ich empfehle dir dazu http://www.tinker.io . Für die Bilder kannst du dann z.B. http://placekitten.com nehmen.

 

[dog_marley]

ok, SRY ..

nun gut, hier mal der teil den ich meine:

http://www.vonhumboldt.de/test/mitmousebild.html

wie gesagt, würd mich riesig freuen, wenn´s da was gibt.

gruß

 

[threadi]

Die Position kannst Du über Änderung der Werte hier

wmtt.style.left = (x + 10) + "px";
wmtt.style.top = (y + 10) + "px";

beeinflussen. Der Wert + 10 entspricht dem Abstand nach zum Zeiger nach links btw. nach oben.

 

[CPoly]

Ich habe das mal schnell demonstriert: https://tinker.io/7ebb3

 

[dog_marley]

schon klar .. aber gilt dann ja für alle wenn ich nicht irre .. trotzdem danke

 

[dog_marley]

danke cpoly .. werd das morgen mal ausprobieren .. ist es richtig, dass der mouseover bei deinem zweiten model vom 3. bild im ie nicht geht und vom 4. so gerade eben am linken rand zu sehen ist? .. vielen dank nochmal .. morgen gehts dann weiter

 

[CPoly]

Ich habe das im IE nicht getestet. Ich will dir damit lediglich die Vorgehensweise demonstrieren.

 

[dog_marley]

ok, bisschen rumgespielt, abgeändert und nun klappt alles .. vielen dank noch mal