如何通過點擊身體上的任何位置來關閉側面菜單（插件）？

我有這個插件，我從http://www.berriart.com/sidr/下載一旦我點擊一個按鈕，它顯示幻燈片的菜單，當我想關閉它，我只能通過點擊相同的按鈕關閉它。現在我想在主體的任何位置添加一個點擊以移回菜單。誰能幫我解決這個問題嗎？如何通過點擊身體上的任何位置來關閉側面菜單（插件）？

這裏是我的html：

<div id="sidr"> 
<!-- <button class="close-side-menu"><i class="icon-close"></i></button> --> 
<ul> 
<li> 
</li> 
</ul> 
</div> 
<button type="button" class="menu-icon open-side-menu"> 
<a id="simple-menu" href="#sidr"> 
</a> 
</button> 
<script> 
$(document).ready(function() { 
$('#simple-menu').sidr(); 
}); 
</script>

來源

2014-10-29 billel spinoo

未經檢驗的，但應符合您的需求：

$(document).ready(function() { 
    $("body").click(function() { 
     if ($(this).attr('id') != 'simple-menu') && !$(this).parents('#simple-menu').length) { 
       $.sidr('close', 'simple-menu'); 
     } 
    }); 
});

這將檢查一下身體解僱onclick事件並確認你沒有點擊菜單或菜單的祖先

來源

2014-10-29 18:33:13

感謝您的幫助。它仍然沒有工作，它說：未捕獲的錯誤：語法錯誤，無法識別的表達式：不支持僞：懸停任何想法？ – 2014-10-29 18:46:00

您發佈的代碼和我發佈的代碼都沒有使用：懸停，以便將問題放在代碼中或庫中的其他位置。你可以在jsfidde中重現這個問題嗎？或者你有一個可以指導我到哪裏的活網站？ – 2014-10-29 18:48:50

我試圖重現jsfidde中的問題，但我couldnt，因爲我有很多文件，我仍然在本地工作，所以我沒有鏈接到我正在工作的網站。如果您看一下http://www.berriart.com/sidr/上的實際插件，會有幫助嗎？我正在使用的名爲「simple menue」的插件 – 2014-10-29 19:06:12

試試這個腳本：

$(document).mouseup(function (e){ 
    var container = $("#sidr"); 

    if (!container.is(e.target) // if the target of the click isn't the container... 
     && container.has(e.target).length === 0) // ... nor a descendant of the container 
    { 


     $.sidr('close', 'sidr'); 

    } 
});

管理從這個here得到一個腳本，然後能夠添加$.sidr('close', 'sidr');只是確保將'sidr'更改爲您想嘗試菜單的類名稱。

希望這會有所幫助。

來源

2015-02-05 12:20:51 JDavies

如何通過點擊身體上的任何位置來關閉側面菜單（插件）？

回答

相關問題