禁用任何與div的交互（點擊，拖動，滾動）

我有一個網站與jQuery全頁插件。我的手機導航打開，將主窗口轉換爲大約80％的右側並拖動以查看移動菜單。禁用任何與div的交互（點擊，拖動，滾動）

Live preview（僅移動版本）

我作出點擊.section僞切換。菜單開上頭類，但如果用戶拖拽或上部滾動整頁插件功能扭曲了窗口的視圖。

我需要禁用與.section的任何交互，或者切換與toggleClass的默認交互。

我已經試過：

e.preventDefault - 這將禁用.section僞DIV的點擊toggleClass菜單打開
指針的事件：無 - 不工作

但用戶仍然可以與右側部分（白色div）進行交互。

我想讓他們點擊它來切換菜單打開的類，這樣窗口將被帶回到它們的主視圖。
我想禁用滾動或拖動部分的能力，以防止jQuery Full頁面重新計算窗口位置並在移動菜單打開時替換窗口。

這是我使用jQuery中要切換菜單，切換菜單上的部分被點擊時的代碼：

$('nav, .mobile-menu--close').click(function(e){ 
    $('body').toggleClass('menu-open'); 
}); 
$('.section').click(function(e){ 
    if ($('body').hasClass('menu-open')) { 
     $('body').toggleClass('menu-open'); 
    }; 
});

我需要更新該位，以檢測（用戶滾動或拖動'.section'）可以防止默認的jQuery Full Page功能（滑動到其他部分或幻燈片），只需切換菜單打開的類。

找到了解決辦法。在下面發佈。

來源

2017-05-23 milka

到目前爲止您嘗試過哪些代碼？ – kqcef

這裏的實際問題是什麼？當我點擊菜單時，它會打開扭曲開始？你能詳細說明嗎？發佈一些代碼，給我們更多的信息。 – rockmandew

我已經添加了我已經嘗試過以及截圖和一些我想要實現的信息。我希望我能更好地解釋我的問題。讓我知道你是否需要更多信息。 – milka

解決方法。

我已經創建了一個固定排序固定頂部：0;正確：0;底部：0;寬度：26％; background-image：線性漸變（從右到左漸變的陰影）;

菜單關閉時，它的指針事件：無;不透明度：0;

當菜單打開時，它的不透明度爲1;指針事件：全部;

它吸收來自用戶的任何交互，並將作爲jQuery中的菜單打開切換按鈕。 jQuery更改了以下代碼：

$('.mobile-shadow').click(function(e){ 
    $('body').toggleClass('menu-open'); 
});

來源

2017-05-24 10:50:59 milka

禁用任何與div的交互（點擊，拖動，滾動）

回答

相關問題