根據瀏覽器的窗口寬度，我可以設置jQuery的手風琴嗎？

Question

如果點擊菜單（h3），此腳本完美工作，它將整個菜單收縮到最小高度。
然後我再次單擊，它會擴展回原始大小。

今天，有兩種觀衆，如PC和智能手機。

我想讓此菜單顯示爲默認情況下的最小尺寸，當查看器使用智能手機瀏覽此頁時，其瀏覽器寬度小於400像素。最小尺寸意味着手風琴關閉時的高度尺寸。
可能嗎？

的JavaScript

jQuery(document).ready(function() { 
    $(".accordion dt").click(function(){ 
     $(this).next("dd").slideToggle(); 
     $(this).next("dd").siblings("dd").slideUp(); 
     $(this).toggleClass("open"); 
    $(this).siblings("dt").removeClass("open"); 
}); 

HTML

<div class="accordion"> 
    <dt><h3>Menu</h3></dt> 
    <dd> 
    Menu Contents 
    </dd> 
</div> 

UPDATE

if ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0) { 
     1. I want to show Menu as minimum size(Shrinked size) 
    }else { 
     2. I want to show Menu as maximum size(Expanded size) 
    } 

Answer 1

很難決定確切的˚F orm的代碼沒有更多的信息關於你正在嘗試做什麼。如果要檢查瀏覽器的類型，瀏覽的網頁，我會建議匹配navigator.userAgent的字符串與普通的移動瀏覽器是這樣的：

var sUserAgent = navigator.userAgent.toLowerCase(); 
var bMobileBrowser = (sUserAgent.indexOf('iphone') !== -1) || (sUserAgent.indexOf('android') !== -1) || (sUserAgent.indexOf('mobile') !== -1); 

if(bMobileBrowser) { 
    // Do something special if it's a mobile browser 
} 

話雖這麼說，如果你在不同的內容設置根據瀏覽器窗口的大小，jQuery爲您提供方便的跨瀏覽器方法$（window）.width（）和$（window）.height（），它們分別返回寬度和高度以像素爲單位的視口（令人震驚！）。在你的情況下代碼可能看起來像這樣：

// This is a much shorter (and my preferred) way of writing jQuery(document).ready 
$(function() { 

    // Why bother rewrapping '.accordion dt' in a new selector every time its referenced? 
    var $accordionHeader = $(".accordion dt"); 

    $accordionHeader.click(function() { 
    $accordionHeader.next("dd").slideToggle(); 
    $accordionHeader.next("dd").siblings("dd").slideUp(); 
    $accordionHeader.toggleClass("open"); 
    $accordionHeader.siblings("dt").removeClass("open"); 
    }); 

    // Toggle the accordion if the browser window's width is less than 400px 
    if($(window).width() < 400) $accordionHeader.click(); 
});