2013-04-27 273 views
1

我有問題,我的jquery下拉懸停效果。出於某種原因,下拉式容器向上移動。任何幫助將非常感激。jquery下拉懸停效果

$(document).ready(function() { 
    $("#submit").mouseenter(function(){ 
     $("#dropdown_container").slideDown(); 
    }); 
    $("#dropdown_container").mouseleave(function(){ 
     $("#dropdown_container").slideUp(); 
    }); 
}); 

Rest of the code

Rememeber在菜單

+0

不,它不是,它下移。 – SoonDead 2013-04-27 22:01:02

+0

你的html代碼有未封閉的標籤。對我來說,它的工作..當你有問題嗎? – CodeArtist 2013-04-27 22:02:00

+0

你到底想做什麼? – Christian 2013-04-27 22:02:29

回答

3

嘗試設置margin-top爲您#dropdown_container例如:

#dropdown_container { 
    margin-top: 35px; 
} 

希望這個作品!

+0

@謝謝你做了這個訣竅 – Dynamiite 2013-04-27 22:15:33

+0

你有沒有關於如何提高jquery懸停效果的任何建議,它對於有時候在mouseleave上的響應不錯有時 – Dynamiite 2013-04-27 22:19:19

+2

其實這是因爲你正在檢測'mouseleave'只有'#dropdown_container',你也應該在'#submit'上使用它。例如:'$(「#submit」)。mouseleave(function(){ \t \t $(「#dropdown_container」)。slideUp(); \t});'' – LRA 2013-04-27 22:23:33

0

嘗試動畫的容器填充,底部向下生長的大小,像這樣選擇jQuery框架,並告訴我,如果你的作品:

$("#submit").on("mouseenter",function(){ 
     $("#dropdown_container").animate({"padding-bottom":"200px"}, fast); 
    }); 
0

您可以添加到float: left#dropdown_container

#dropdown_container { 
    float: left; 
} 

jsfiddle