[Aetae]

Условно одновременно. Все всплывающие штуки всё равно делаются таймаутом иль интервалом, т.е. ...
Ну допустим простейший вариант:
работет

<div id='the_id' style="margin:50px;height:60px;background:#ddf;width:50px;"></div>
		<script type="text/javascript">
		function event(o,e,h) {o.addEventListener?o.addEventListener(e, h, false):o.attachEvent('on'+e,h)}
		m={i:50,h:0,s:0}
		id=document.getElementById('the_id');
		event(id,'mouseover',show);
		event(id,'mouseout',hide);
		function show()
		{
		!m.h||clearTimeout(m.h);
		if(m.i<400) {id.style.width=(m.i=m.i+10)+'px';m.s=setTimeout(show,10)}
		}
		function hide()
		{
		!m.s||clearTimeout(m.s)
		if(m.i>50) {id.style.width=(m.i=m.i-10)+'px';m.h=setTimeout(hide,10)}
		}
		</script>

не работает

<div id='the_id2' style="margin:50px;height:60px;background:#fdd;width:50px;"></div>
		<script type="text/javascript">
		function event(o,e,h) {o.addEventListener?o.addEventListener(e, h, false):o.attachEvent('on'+e,h)}
		m2={i:50,h:0,s:0}
		id2=document.getElementById('the_id2');
		event(id2,'click',show2);
		event(id2,'click',hide2);
		function show2()
		{
		!m2.h||clearTimeout(m2.h);
		if(m2.i<400) {id2.style.width=(m2.i=m2.i+10)+'px';m2.s=setTimeout(show2,10)}
		}
		function hide2()
		{
		!m2.s||clearTimeout(m2.s)
		if(m2.i>50) {id2.style.width=(m2.i=m2.i-10)+'px';m2.h=setTimeout(hide2,10)}
		}
		</script>