Próbuje zrobić menu, ale mam jeden problem, a dokładniej nie wiem jak zrobić jedną rzecz. Chodzi o ten fragment:
Kod
el.onmouseout = function(e){
document.body.removeChild(menu);
}
Teraz menu chowa się wtedy kiedy kursor będzie poza linkiem, a jak to przerobić żeby się chowało wtedy kiedy kursor będzie poza linkiem i poza div'em menu?
<script type="text/javascript">
function menu(el, m){
var menu = document.createElement("div");
xpos = findPos(el)[0];
ypos = findPos(el)[1] + el.offsetHeight;
menu.style = 'background: lime; border: 1px solid green; position:absolute; top:' + ypos + 'px; left: ' + xpos + 'px';
if (m == 1)
menu.innerHTML = '
<ul><li><a href="profile">Profil
</a></li></ul>';
else if (m == 2)
menu.innerHTML = '
<ul><li><a href="settings">Ustawienia
</a></li></ul>';
document.body.appendChild(menu);
el.onmouseout = function(e){
document.body.removeChild(menu);
}
}
function findPos(obj) {
var nleft = 0;
var ntop = 0;
if (obj.offsetParent) {
nleft = obj.offsetLeft
ntop = obj.offsetTop
while (obj = obj.offsetParent) {
nleft += obj.offsetLeft
ntop += obj.offsetTop
}
}
return [nleft,ntop];
}
<a href="fdsf" onmouseover="menu(this, 1)">Menu 1
</a> |
<a href="fdsf" onmouseover="menu(this, 2)">Menu 2
</a>