jQuery的下拉菜單中引導平板電腦或手機大小

Question

不工作我有完美的作品，除了當我縮小瀏覽器到平板電腦或手機大小的導航欄的自舉下拉（< 767px寬）。代碼導航欄是：

<div class="navbar navbar-fixed-top"> 
<div class="navbar-inner"> 
    <div class="container-fluid"> 

    <a href="<%= root_url %>" class="brand brandtag"></a> 
    <a class="btn btn-navbar visible-phone" data-toggle="collapse" data-target=".nav-collapse"> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </a> 

    <div class="pull-right"> # DROPDOWN THAT WORKS SPORADICALLY 
    <div id="user-nav"> 
    <div class="not-logged-in"> 
    <a class="dropdown-toggle btn btn-inverse" href="<%= new_user_session_path %>" data-toggle="dropdown"> 
     Login <span class='caret'></span> 
    </a> 
    <div class="dropdown-menu"> 
     <%= render "devise/sessions/new_from_dropdown" %> 
    </div> 
    </div> 
    </div> 
    </div> 

    <div class="nav-collapse"> 
    <ul class="nav"> 
     <li class="active"><a>Link 1</a></li> 
     <li class="active"><a>Link 2</a></li> 
     <li class="active"><a>Link 3</a></li> 
     <li class="active"><a>Link 4</a></li> 
    </ul> 
    </div><!--/.nav-collapse --> 
</div> 

和我的javascript很簡單：

jQuery -> 
    $(".dropdown-toggle").attr("href", "#").dropdown() 
    $('.dropdown-menu form label.hide').hide() 
    $('.dropdown-menu input, .dropdown-menu label').on 'click', (e) -> 
    e.stopPropagation() 

下拉工作在大尺寸完全正常（> 767px），但是一旦在屏幕下方下降該大小，下拉菜單停止顯示。我可以調整屏幕的大小或縮小屏幕大小，下拉菜單會分別返回或消失，因爲它會通過767像素的寬度。

有誰知道如何解決這個問題？似乎是bootstrap的JavaScript中的東西，但我無法弄清楚什麼。

Answer 1

出於某種原因，包裹「下拉菜單，切換」和「下拉菜單」的div與類=「下拉菜單」另一個DIV解決了這個問題。所以，上面的代碼，是用非常小的改動：

<div class="pull-right"> # DROPDOWN THAT WORKS SPORADICALLY 
<div id="user-nav"> 
    <div class="dropdown not-logged-in"> # <-- "dropdown" class added 
    <a class="dropdown-toggle btn btn-inverse" href="<%= new_user_session_path %>" data-toggle="dropdown"> 
    Login <span class='caret'></span> 
    </a> 
    <div class="dropdown-menu"> 
    <%= render "devise/sessions/new_from_dropdown" %> 
    </div> 
    </div> 
</div> 

我不知道爲什麼這不僅影響了移動&平板電腦的尺寸，但這樣是使用他人的框架的陷阱！