# Hover - POP UP



## nentus (12. März 2004)

Wie bekomme ich es hin, das wenn ich über ein bild mit der maus gehe, das ein kleines Pop Up erscheint mit einem Bild?


----------



## Gottox (12. März 2004)

Ganz einfach:

```
<a href="#" onmouseover="window.open('LINK','poup','width=BREITE,height=HÖHE')">Mouseover</a>
```
Ist aber nervig, wenn man aus versehen über den link fährt und dann ein neues Fenster auf geht... Besuchern gefällt das sicher nicht...


----------



## fluessig (12. März 2004)

Geht das nicht auch ohne ein neues Fenster, so dass man mit einem div eine neue Ebene einblendet  und das nur bei onmouseover passiert?


----------



## Gottox (12. März 2004)

Jippie, auf die Frage hab ich gewartet:

In den Head:

```
<script>
function getLeft(elm)
	{
	var mOffsetLeft = elm.offsetLeft;
	var mOffsetParent = elm.offsetParent;

	while(mOffsetParent) {
		mOffsetLeft += mOffsetParent.offsetLeft;
		mOffsetParent = mOffsetParent.offsetParent;
	}
	return mOffsetLeft;
	}
function getTop(elm)
	{
	var mOffsetTop = elm.offsetTop;
	var mOffsetParent = elm.offsetParent;

	while(mOffsetParent){
		mOffsetTop += mOffsetParent.offsetTop;
		mOffsetParent = mOffsetParent.offsetParent;
	}
function setDiv(elem)
	{
	var popup = document.getObjectById('popup');
	popup.style.display = "block";
	popup.style.left = getLeft(elem);
	popup.style.top = getTop(elem);
	}
</script>
```

In den Body

```
<div id="popup" onmouseout="this.style.display='none'" style="position:absolute;display:none">
Inhalt
</div>
<a href="#" onmouseover="setDiv(this)">MOUSEOVER</a>
```

Beim Mouseover erschein der Layer an der Position des Links, wenn man den Layer mit der Maus verlässt verschwindet er wieder.

Wie immer keine garantie fürn funktionstüchtigen Script, ist ungetestet...


----------



## fluessig (12. März 2004)

Ich wußte du hast es drauf Gottox ;-)


----------



## Gottox (12. März 2004)

*lmao*
Das nehm ich mal als echtes Kompliment!
Danke!


----------



## nentus (13. März 2004)

Das habe ich gesucht , danke @ Gottox


----------



## PhoenixXP (13. März 2004)

Ist in dem JS-Script ein Fehler in der Funktion getTop() ?

Es fehlt die Rückgabe der vertikalen Position (return mOffsetLeft;) und die schließende Klammer (})

Korrekturvorschlag:


```
function getLeft(elm)
{
    var mOffsetLeft = elm.offsetLeft;
    var mOffsetParent = elm.offsetParent;

    while(mOffsetParent) {
        mOffsetLeft += mOffsetParent.offsetLeft;
        mOffsetParent = mOffsetParent.offsetParent;
    }
    return mOffsetLeft;
}
function getTop(elm)
{
    var mOffsetTop = elm.offsetTop;
    var mOffsetParent = elm.offsetParent;

    while(mOffsetParent){
        mOffsetTop += mOffsetParent.offsetTop;
        mOffsetParent = mOffsetParent.offsetParent;
    }
    return mOffsetTop;
}
function setDiv(elem)
{
    var popup = document.getObjectById('popup');
    popup.style.display = "block";
    popup.style.left = getLeft(elem);
    popup.style.top = getTop(elem);
}
```


----------



## Gottox (13. März 2004)

Tja, sowas passiert manchmal mit copy & paste... Danke für die Korrektur!


----------



## OnkelGonzo (12. April 2004)

Öhm... blöde Frage, aber wie kann ich diese DIVs bestimmen? Also wo sie liegen etc.



Gruß,
Gonzo


----------

