webForumDet fria alternativet

Problem med onmouseout...

3 svar · 217 visningar · startad av Fredrik.an

Fredrik.anMedlem sedan sep. 2001238 inlägg
#1

Det är så att jag har en drop-downmeny men jag får inte till onmousout.
Vad ska jag egentligen skriva för att den ska försvinna då musen förs utanför...
Har sökt och funnit lite men min hjärna är ur funktiuon som sagt vad. Därför lämnar jag koden här utan någon som helst variant på onmouseout.

		
		<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}
//-->
</script>

<style type="text/css">
<!-- 
/* CSS issu des tutoriels www.alsacreations.com/articles */
body {
margin: 0;
padding: 0;
background: white;
font: 80% verdana, arial, sans-serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu  { visibility: visible; position: absolute; z-index: 100; top: 0; left: 0; width: 100% }
#menu dl {
float: left;
width: 12em;
margin: 0 1px; 
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ccc;
border: 1px solid gray;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}

#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray; 
}

a {text-decoration: none;
color: black;
color: #222;
}
-->
</style>
		
	</head>

	<body bgcolor="#ffffff">
		<div id="menu">
		
		<dl>			
		<dt onmouseover="javascript:montre('smenu1');">Menu 1</dt>
			<dd id="smenu1">
				<ul>
					<li><a href="#">1.1</a></li>
					<li><a href="#">1.2</a></li>
					<li><a href="#">1.3</a></li>
					<li><a href="#">1.4</a></li>
					<li><a href="#">1.5</a></li>
					<li><a href="#">1.6</a></li>
				</ul>
			</dd>
	</dl>
</div>
Peter SMedlem sedan dec. 20025 484 inlägg
#2

Testa detta:

function mout(id, e){
    var d = document.getElementById(id);
    var s = window.event ? window.event.toElement : e.relatedTarget;
    while (s){
	if (s == d){ return }
	s = s.parentNode;
    }
    d.style.display = "none";
}

<dd id="smenu1" onmouseout="mout('smenu1', event)">
Fredrik.anMedlem sedan sep. 2001238 inlägg
#3

Tackar så otroligt mycket. Du är en pärla ;)

Peter SMedlem sedan dec. 20025 484 inlägg
#4

Glöm inte att acceptera det inlägg som löste problemet som slutgiltigt. :bire

Genererad på 363 ms · cache AV · v20260730165559-full.f96bc7eb