如果點擊外部隱藏/切換

我在這裏使用此模板（http://startbootstrap.com/templates/simple-sidebar.html）爲我的啓動學習啓動。我發現學習很不錯。但我有疑問。如果點擊外部隱藏/切換

當我在移動模式下打開模板時，它會顯示一個圖標（菜單圖標），當我點擊它時，它會顯示側邊欄。現在，當我在div外部單擊時，理想情況下它應該隱藏側邊欄（自動切換），但它沒有。請讓我知道如何解決/實現它。

用於切換的DIV的腳本如下：

$("#menu-toggle").click(function(e) { 
    e.preventDefault(); 
    $("#wrapper").toggleClass("active"); 
});

此外，如果您有任何引導固定側邊欄的演示，請分享。

來源

2014-03-26 CyberWizard

也提供你的html –

你實際上需要展示你試過的東西，指出你有的具體問題。這就是工作原理。這不是關於共享代碼，而是修復現有的代碼。 – Shomz

你可能想看看jquery –

試試這個：

$("#menu-toggle").click(function(e) { 
    e.preventDefault(); 
    $("#wrapper").toggleClass("active"); 
}); 

$("#page-content-wrapper").click(function(e) { 
    e.preventDefault(); 
    if $("#wrapper").hasClass("active"){ 
     $("#wrapper").toggleClass("active"); 
    } 
});

這將允許在側邊欄隱藏你聽上的菜單切換按鈕的點擊收聽的內容時，其餘的點擊邊欄是可見的。

來源

2014-03-26 18:51:25

PERFECT answer.this做技巧伴侶。但是，我還沒有問過它，但當側邊欄切換（可見），我向左滑動，我需要再次切換邊欄。（手勢類型）。我可以使用基本的jQuery來實現它嗎？ – CyberWizard

@CyberWizard如果你在談論滑動手勢，你將無法通過JQuery來實現這一點。你可以看看https://jqueryui.com/ –

你將需要創建一個絕對定位的div覆蓋你想點擊的內容區域來隱藏邊欄，你必須通過CSS指定它的寬度和高度。它也需要自己的點擊事件。把它看作是一個巨大的按鈕，它覆蓋了左側的內容。如果您導航到其他部分，此示例不會涵蓋隱藏div的情況。

$('#menu-toggle').click(function(e) { 
$('.covers-content').show(); 
}); 

$('.covers-content').onClick(function(e) { 
$('#wrapper').toggleClass("active"); 
$('.covers-content').hide(); 
}); 

<div class="covers-content" style="display:none"></div>

來源

2014-03-26 18:21:24 Chris

如果點擊外部隱藏/切換

回答

相關問題