我需要停止DIV消失時，我將鼠標移到DIV鏈接

這裏是我的完整代碼，當我將鼠標懸停在popupcontact div上時，它顯示了divtoshow div，它有一個鏈接名稱rahul，當我將鼠標懸停它隱藏div名稱divt的鏈接。我的div應該隱藏，當我mouseout不當我滑過鏈接。請儘快幫助。我需要停止DIV消失時，我將鼠標移到DIV鏈接

問候拉胡爾

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr"> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js" type="text/javascript"></script> 
</head> 
<body> 
    <div id="popupContact" style="position:absolute;left:100px;top:100px;width:100px;height:50px;background-color:orange;border:1px solid red ;"> 
    </div> 
    <div id="divtoshow" style="display:none;background-color:green; border:1px solid black;width:200px;height:100px;position:absolute;"> 
    dsfdssd <div><a href="#">rahul</a></div> 
    </div> 
</body> 
</html> 
<script type='text/javascript'> 
$(document).ready(function(){ 
    var popup_pos=$('#popupContact').offset(); 
    var timer; 
    $("#popupContact").mouseover(function() { 
     if(timer) { 
      clearTimeout(timer); 
      timer = null 
      } 
     timer = setTimeout(function() { 
      console.log($("#VersionSelectField").is(':hidden')); 
      if(!$("#VersionSelectField").is(':hidden')){ 
       $("#divtoshow").css('position',"absolute"); 
       $("#divtoshow").css('top',popup_pos.top-20);  
       $("#divtoshow").css('left',popup_pos.left-20); 
       $("#divtoshow").fadeIn(300); 
       $("#popupContact").hide(); 
      } 

     }, 100); 

     }); 

    $("#divtoshow").mouseout(function() { 
      if(timer) { 
       clearTimeout(timer); 
       timer = null 
       } 
      timer = setTimeout(function() { 
       $("#divtoshow").fadeOut("slow"); 
       $("#popupContact").show(); 

      }, 1000); 
    }); 
}); 
</script>

來源

2010-08-30 XMen

嗨查克，你編輯？ – XMen 2010-09-07 06:00:49

而不是.mouseout()這樣的：

$("#divtoshow").mouseout(function() {

使用.mouseleave()，像這樣：

$("#divtoshow").mouseleave(function() {

這將進入一個不用時火孩子el像mouseout意志，這是目前正在隱藏，當你不想要它。

另外一個代碼提示，您可以在#divtoshow選擇，甚至更好鏈和至少鏈傳遞一個對象來.css()，像這樣：

$("#divtoshow").css({ position: "absolute", 
         top: popup_pos.top-20, 
         left: popup_pos.left-20 }) 
       .fadeIn(300);

而且，這不是一個問題你的標記，但如果#popupContact有一個子元素，你會遇到與mouseover類似的問題，那麼在子節點上不等價的是mouseenter。

來源

2010-08-30 11:51:01

感謝尼克它工作 – XMen 2010-09-07 05:59:50

@Rahul - 歡迎:)如果他們解決您的問題，一定要接受答案:) – 2010-09-07 09:50:23

使用setTimeout和clearTimeout時，請務必通過調用window.setTimeout和window.clearTimeout確保使用這些函數的完整路徑。

我發現有時它不能在某些版本的IE中正常工作，如果你沒有。

來源

2011-06-01 06:03:09 foomip

我需要停止DIV消失時，我將鼠標移到DIV鏈接

回答

相關問題