휴대 기기에 링크로 드롭 다운을 관리하는 방법

Question

안녕하세요, 안녕하세요, 몇 가지 문제가 있습니다. 헤더의 쇼핑 바구니 링크에서 드롭 다운을 사용했지만 용지 크기를 반응 형 (모바일)으로 변경하면 간단해야합니다. 하이퍼 링크지만 드롭 다운으로 작동합니다. 이것은 부트 스트랩 마크 업에 따라 작동합니다. 이 드롭 다운 등의 모바일 장치에서 작동이 같이해야합니다 데스크탑 용지 크기에, 그래서

여기

전체 헤더 마크 업

링크로 링크로

그래서 사람이 마크 업을 변경하는 방법을 말해 줄 수

<div class="row"> 
     <div class="col-md-12"> 
      <ul class="nav navbar-nav navbar-right"> 
       @Html.Widget("header_links_before") 
       @Html.Action("AdminHeaderLinks", "Common") 
       @*<li> 
         @Html.Action("TaxTypeSelector", "Common") 
        </li> 
        <li> 
         @Html.Action("CurrencySelector", "Common") 
        </li> 
        <li> 
         @Html.Action("LanguageSelector", "Common") 
        </li>*@ 
       @if (Model.IsAuthenticated) 
       { 
        <li><a href="@Url.RouteUrl("CustomerInfo")" class="account">@Model.CustomerEmailUsername</a></li> 
        <li><a href="@Url.RouteUrl("Logout")" class="ico-logout">@T("Account.Logout")</a></li> 
       } 
       else 
       { 
        <li><a href="@Url.RouteUrl("Register")" class="ico-register">@T("Account.Register")</a></li> 
        <li><a href="@Url.RouteUrl("Login")" class="ico-login">@T("Account.Login")</a></li> 
       } 
       @if (Model.AllowPrivateMessages) 
       { 
        <li> 
         <a href="@Url.RouteUrl("PrivateMessages", new { tab = "" })" class="ico-inbox">@T("PrivateMessages.Inbox")<span>@Model.UnreadPrivateMessages</span></a> 
        </li> 
        if (!string.IsNullOrEmpty(Model.AlertMessage)) 
        { 
         <script type="text/javascript"> 
          $(document).ready(function() { 
           displayPopupNotification('@Html.Raw(HttpUtility.JavaScriptStringEncode(Model.AlertMessage))', 'success', false); 
          }); 
         </script> 
        } 
       } 
       @if (Model.ShoppingCartEnabled) 
       { 
        <li id="topcartlink" class="dropdown"> 
         <a href="@Url.RouteUrl("ShoppingCart")" class="ico-cart dropdown-toggle" data-toggle="dropdown"> 
          <span class="cart-label">@T("ShoppingCart")</span> 
          <span class="cart-qty">@T("ShoppingCart.HeaderQuantity", Model.ShoppingCartItems)</span> 
          <span class="caret"></span> 
         </a> 

          <ul class="dropdown-menu" role="menu"> 
           @Html.Action("FlyoutShoppingCart", "ShoppingCart") 
          </ul> 
        </li> 
       } 
       @if (Model.WishlistEnabled) 
       { 
        <li>enter code here 
         <a href="@Url.RouteUrl("Wishlist")" class="ico-wishlist">`enter code here` 
          <span class="cart-label">@T("Wishlist")</span> 
          <span class="wishlist-qty">@T("Wishlist.HeaderQuantity", Model.WishlistItems)</span> 
         </a> 
        </li> 
       } 
       @Html.Widget("header_links_after") 
      </ul> 
     </div> 
    </div> 

아래와 같은 이미지 링크를 확인하시기 바랍니다

http://imageupper.com/i/?S0200010090013K14096405471629783 http://imageupper.com/i/?S0200010090023K14096405471629783tw

Answer 1

이 시도 :

또한

$('.dropdown-toggle').click(function(e) { 
e.preventDefault(); 
setTimeout($.proxy(function() { 
if ('ontouchstart' in document.documentElement) { 
    $(this).siblings('.dropdown-backdrop').off().remove(); 
} 
}, this), 0); 
});