分辨率觸發引導4下拉菜單/手機

-1

我有一個包含一些鏈接的標題。當標題變得足夠短時，它會進入移動視圖（摺疊樣式）。分辨率觸發引導4下拉菜單/手機

我想最初顯示的下拉菜單中，但可切換爲隱藏，並再次顯示正常人一樣。基本上我想要的是：當頁面加載/調整大小和導航欄進入移動時，切換下拉，使其可見。

您可以通過執行切換下拉：

$("#element").dropdown("toggle");

玩弄我的例子在這裏：https://codepen.io/anon/pen/ZKbJJV

來源

2017-04-18 MortenMoulder

如果有人能告訴我爲什麼他們downvoted，那會b很棒。謝謝。 – MortenMoulder

-1

UPDATE：

$(document).ready(function() { 
    $(window).resize(function() { 
     if($(window).width()<=768) { 
      $("#element").removeClass("dropdown-menu"); 
     }else{ 
      $("#element").addClass("dropdown-menu"); 
     } 
    }); 
    if($(window).width()<=768) { 
     $("#element").removeClass("dropdown-menu"); 
    }else{ 
     $("#element").addClass("dropdown-menu"); 
    } 
});

現在我已經刪除再次嘗試並添加類，它的作品。 http://codepen.io/julianschmuckli/pen/ybYzQe

你可以執行的代碼，該網頁加載完成後：

$(document).ready(function() { 
    if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { 
    $("#element").dropdown("toggle"); 
    } 
});

要檢測它是否是移動的，我複製從這裏摘錄：What is the best way to detect a mobile device in jQuery?

或者你也可以嘗試使用此版本來定義頁面的特定寬度：

$(document).ready(function() { 
    if($(window).width()<=768) { 
     $("#element").dropdown("toggle"); 
    } 
});

來源

2017-04-18 10:55:33

1）我不想只在手機上做。 2）如果我調整大小，會發生什麼？它不會觸發。 3）如果我調整大小並顯示下拉菜單會發生什麼情況，那麼我再次調整大小以便再次切換？它會隱藏它。對不起，但它不僅僅是切換它。 – MortenMoulder

@MortenMoulder我已經更新了我的答案。 –

沒有冒犯或什麼，但你真的在嘗試嗎？我向你提供了一個codepen鏈接，你正在做的事情是行不通的。如果你認爲這將起作用，它將爲你在768下調整大小的每個像素運行切換代碼。如果你調整窗口的大小，它會直接切換數百次。 – MortenMoulder

分辨率觸發引導4下拉菜單/手機

回答

相關問題