點擊jquery無法正常工作

你已經嘗試創建一個dropmenu點擊工作，所以觸摸屏可以使用菜單。點擊jquery無法正常工作

$('a.dropsmall2').click(function() { 
$(this).next('ul').slideToggle(500,'easeInOutQuad');

}）;

這部分似乎起作用。

$('#dropmenu a').click(function() { 
$(this).parents('ul').not('#dropmenu').hide('medium');

}）;

這個部分確實有效，但是一旦你點擊它，菜單在它最終保持關閉之前打開和關閉。

$('#dropmenu ul').mouseleave(function() { 
$(this).slideToggle(500,'easeInOutQuad');

}）; 這部分工作，但一旦鼠標離開菜單，然後就可以打開懸停而不是被點擊（不知道它的這部分搞亂了它或代碼的第一部分

jsfiddle --->http://jsfiddle.net/e9e17adm/15

來源

2015-08-22 alwayslearning

作爲@Vishnu下面提到包括jQuery的在你的jsfiddle，否則你不會如工作。 – mechanicals

'$（this）.slideUp（'500，easeInOutQuad'）;'是錯的，應該是：'$（this）。slideUp（500，'easeInOutQuad'）;''和'slideDown（）'相同，只需檢查DOC –

完成上述操作仍然無效。有同樣的問題 – alwayslearning

下面這個CSS，是你的問題，

.dropmenu ul li { 
    height: 0; 
    overflow: hidden; 
    padding: 0; 
    -webkit-transition: height .3s ease .1s; 
    -moz-transition: height .3s ease .1s; 
    -o-transition: height .3s ease .1s; 
    -ms-transition: height .3s ease .1s; 
    transition: height .3s ease .1s; 
} 
.dropmenu li:hover > ul li { 
    height: 27px; 
    line-height: 27px; 
    overflow: visible; 
    padding: 0; 
}

您已經添加：懸停過渡到子列表，這樣，基本上在CSS你提到onhover of main LI其子菜單BI的高度應增加到27px。它只是最初在CSS中子菜單是

display: "none";

那麼，你是不是能夠看到，你看到click事件後，以後的CSS過渡。因爲，當你做一個的jQuery的onclick，做一個了slideDown 這還附加一個

display: "block";

財產在子菜單中的內嵌樣式UL元素

因此，現在您可以看到您自己在上面添加的CSS的過渡效果。

UPDATE：

更新你的小提琴解決您的問題。讓我知道，如果這是你想要的東西..

http://jsfiddle.net/e9e17adm/16/

來源

2015-08-22 11:26:19 mechanicals

好的感謝您添加更多信息，變得更清晰。有沒有工作或必須刪除過渡？ – alwayslearning

你想要什麼確切的功能？點擊菜單上的 – mechanicals

打開，在mouseleave菜單關閉時，點擊一個鏈接菜單關閉。 – alwayslearning

點擊jquery無法正常工作

回答

相關問題