zobrazení/schování divu s časovánim

Snažím se o to tohle.. Mám několik divů (tady jen dva na ukázku) a když na jeden z nich najedu, tak se zobrazí jeho obsah. Když z divu odjedu, tak se obsah zase schová.. tohle to funguje s funkcí "prepni", ale chtěl bych to trochu upravit:
1) aby se objekt zobrazil až po určité době (najedu a třeba po 300ms se zobrazí obsah), logicky by pak po mouseout se obsah schoval hned (bez prodlevy)..
2) Zamezit zmatku :) neboli když bych do tý doby (300ms) přejel na jinej div, tak se mi zobrazí obsah aktuálního divu a né toho kde jsem byl před chvílí.. to by pak mohlo dělat docela bordel na stránce a zmást uživatele :)

No snad jste mě pochopily :) O něco jsem se pokoušel s window.setTimeout nebo window.setInterval, ale marně :(

	<script type="text/javascript">

		function prepni(co){

			var el = document.getElementById(co);

			el.style.display = (el.style.display == "none"? "": "none");

		}

	</script>



		<div onmouseover="prepni('hudba');" onmouseout="prepni('hudba');" id="main_hudba">

			<div id="hudba" class="obsah" style="display:none;">

				<span>Home</span>

				<p>Obsah divu.</p>

			</div>

		</div>

		<div onmouseover="prepni('gb');" onmouseout="prepni('gb');" id="main_gb">

			<div id="gb" class="obsah" style="display:none;">

				<span>Guest Book</span>

				<p>Obsah divu.</p>

			</div>

		</div>

Neporadil by někdo aspon co s tim časováním? ten zbytek už bych snad zvládnul sám.. Zkoušel jsem to nastavit takto:

	function zmen(co){

			var el = document.getElementById(co);

			el.style.display = (el.style.display == "none"? "": "none");

			clearTimeout(casovac);

	};

	function prepni(co){			

		casovac = setTimeout("zmen(co)",300);

	}

Ale problém je v tom, že se mi tam nechce předávat ten parametr "co" id divu a jiné řešení mě nenapadá :(

Diky.. ten zápis "zmen("+co+")" se bude hodit do budoucna, ale vyřešil jsem to přes mootools :)