Форум

Kolik317 · #1 (**permalink**) 01.10.2011, 23:37

Хочу для обычной вертикальной выпадающей вниз менюшки из списков добавить плавности и задержку перед закрытием. Когда мышку отводим от пункта (onmouseout) - надо проверить куда мы её отвели - на подпункт или нет. Для этого делаю задержку через settimeout, а там уже проверяю где сейчас курсор. Так вот - почему то не выходит ничего. event.srcElement тупо не работает внутри таймера, а document.activelement хоть убей выдаёт боди. Если взять event.srcElement до таймера - то он берет сам пункт с которого мышку увели, а не тот на который навелись.

<body>
<style>
	#menu5 {
	border: solid 7px black; 	
	border-bottom-color: #e6350c;
	border-right-color: #e6350c;
	border-left-color:#fb8866;
	border-top-color:#fb8866;
	width: 180px;
    }

	#menu5,  #menu5 ul{
	list-style-type: none;
	margin: 0;
	padding:0;		
 }
    #menu5 li ul li{
	margin: 0;
	text-align:left;
    }
 

#menu5 a {display: block; height: 30px;  width: 180px; margin: 0px;  

background-color:#333;

  }
  

  
</style>
 <ul id="menu5"> 

        
        <li  ><a onmouseover="showli()" onmouseout="b()" id="asdd"  href="#">Встречи</a>
        
        <ul onmouseover="a();" onmouseout="b()" > 
        <li><a id="s1" style="opacity: 0.5; filter: alpha(opacity=50);" href="#">Ссылка 1</a></li>
        <li><a style="opacity: 0.5; filter: alpha(opacity=50);" href="#">Ссылка 2</a></li>
        </ul></li>  
        

        
  </ul>
    <SCRIPT  language="javascript">
	var hT, sT, a, ids;
	
	function a()
	{a=2;}
	
	function x()
	{ids=event.srcElement.id;
	alert(ids);}
	
	function b() {
		setTimeout (function()
 {
	x();
	if (ids=='UL'){ Hide('s1', 0.5);}}
	 
	 , 1000); 
	 }
	
	
	
	function c(){
	Hide ('s1', 0.5);}
	
	function showli()
	{a=5; Show('s1', 1);}
	
function Show(objId, x) {
	

var obj = document.getElementsByTagName("a")[1];

op = (obj.style.opacity)?parseFloat(obj.style.opacity):parseInt(obj.style.filter)/100;
if(op < x) {
clearTimeout(hT);
op += 0.1;

	for (var i=1; i<3; i++) {
var obj = document.getElementsByTagName("a")[i];
obj.style.opacity = op;
obj.style.filter='alpha(opacity='+op*100+')';}
sT=setTimeout('Show(\''+objId+'\', '+x+')',30);}
}



function Hide(objId, x) {
	
var obj = document.getElementsByTagName("a")[1];

op = (obj.style.opacity)?parseFloat(obj.style.opacity):parseInt(obj.style.filter)/100;
if(op > x) {
clearTimeout(sT);
op -= 0.1;
for (var i=1; i<3; i++) {
var obj = document.getElementsByTagName("a")[i];
obj.style.opacity = op;
obj.style.filter='alpha(opacity='+op*100+')';
hT=setTimeout('Hide(\''+objId+'\', '+x+')',30);
}}

}

</SCRIPT>


</body>

zebra · #2 (**permalink**) 01.10.2011, 23:53

function a()
{a=2;}
После этого функции a не будет.

Вы опубликовали очень много кода.

Пожалуйста, локализуйте проблему!

Выделите фрагмент кода, по которому есть вопрос и опубликуйте его отдельно.

И, по возможности, уберите из кода мусор, чтобы нам легче было сориентироваться и помочь решить вашу проблему.

Спасибо.

Kolik317 · #3 (**permalink**) 02.10.2011, 00:09

<body>
<style>
	#menu5 {
	border: solid 7px black; 	
	border-bottom-color: #e6350c;
	border-right-color: #e6350c;
	border-left-color:#fb8866;
	border-top-color:#fb8866;
	width: 180px;
    }
	#menu5,  #menu5 ul{
	list-style-type: none;
	margin: 0;
	padding:0;		
 }
    #menu5 li ul li{
	margin: 0;
	text-align:left;
    }
 
#menu5 a {display: block; height: 30px;  width: 180px; margin: 0px;  
background-color:#333;
}
</style>
 <ul id="menu5"> 
 <li  ><a onmouseover="Show('s1', 1)" onmouseout="b()" id="asdd"  href="#">Встречи</a>
<ul> 
<li><a id="s1"  href="#">Ссылка 1</a></li>
</ul></li>  
 </ul>
    
<SCRIPT  language="javascript">
	var ids;
	
	function x()
	{ids=event.srcElement.id;
	alert(ids);}
		
function b() {
setTimeout (function()
 {
	x();
	if (ids=='s1'){alert('ok')}}
	 , 1000); 
	 }


</SCRIPT>
</body>

По коду, надо чтобы когда мы переводим курсор с пункта Встречи на пункт Ссылка 1 нам выдало Id "ссылки 1"(s1) через 1сек. Но event.srcElement.id просто не работает когда вызывается таймером.

zebra · #4 (**permalink**) 02.10.2011, 00:18

Поставьте дебагер, например firebug для мозилы

Форум

Справочник

Discord чат

Курсы javascript