Question

首先，对不起，如果我的英语很糟糕，而不是我的母语，我会努力做到最好：（

所以这是我的问题。当你在类别的h2上clic时，我做了一个简单的菜单，你得到了带有.slideToggle的子类别。

在移动设备上，当我在汉堡按钮上单击并禁用slideToggle时，我希望它们全部用完。

到目前为止，这是我的html和js：

<nav class="full">
    <section class="nav">
        <h2>Category 1</h2>
        <ul>
            <li>
                <a href="">Menu 1</a>
            </li>
            <li>
                <a href="">Menu 2</a>
            </li>
            <li>
                <a href="">Menu 3</a>
            </li>
        </ul>
    </section>
</nav>

我的js只是：

var menuAccountBlock = $("section.nav"),
    menuAccountButtonList = $("section.nav > h2"),
    menuAccountList = $("section.nav > ul");

    $(document).ready(function(){

        $(menuAccountButtonList).click(function () {
            $(this).parent().toggleClass("active");
            $(this).next().slideToggle(300);
        });

    });

所以，当我在类别1上进行clic时，它会使用slideToggle打开ul并为我的css添加一个类。我只想在低于1020px的窗口宽度时禁用切换，我该怎么做？

Answer 1

以下是检测您的网站是否在移动设备上运行的方法（返回TRUE或FALSE）：

function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
  || navigator.userAgent.match(/iPhone/i)  
  || navigator.userAgent.match(/Windows Phone/i) 
  || navigator.userAgent.match(/iPod/i) 
  || navigator.userAgent.match(/webOS/i)
  || navigator.userAgent.match(/BlackBerry/i)      
  || navigator.userAgent.match(/iPad/i)
  ){
    return true;
  }
 else {
    return false;
  }
}

所以，你可以这样做：

if (!detectmob()){//if will not a mobile device
    //here put your code for hide the UL
}

只有在移动设备中无法运行时才会隐藏UL。

在移动设备上关闭.slideToggle

1 个答案: