Question

我有一个小脚本可以在电脑屏幕上正常工作，但是当我把它放在手机上时我会工作。我试着在这里找到答案，但我找到了一些这样小的答案。我在宽度不同的样式表之前使用了它，并且没有问题。现在我正在尝试使用它@ width all和（xxxxx）在相同的样式表中，并在这里讲授手机上的工作。

if(window.innerWidth && window.innerWidth<=480){
    $(document).ready(function() {
    $('ul.nav').addClass('hide');
      $('header').append('<div class="left_buttom"     onclick="toggleMenu()"><img src="images/nav.png"></div>');  
    });
      function toggleMenu(){
        $('ul.nav').toggleClass('hide');
        $('header .left_buttom').toggleClass('pressed'); //indbygget jq class
      }
}

Answer 1

$(document).ready(function() {
    if (window.innerWidth && window.innerWidth <= 480) {
        $('ul.nav').addClass('hide');
        $('header').append('<div class="left_buttom" onclick="toggleMenu()"><img src="images/nav.png"></div>');
    }
});

function toggleMenu() {
    $('ul.nav').toggleClass('hide');
    $('header .left_buttom').toggleClass('pressed'); //indbygget jq class
}

在ready

if

toggleMenu

if

Answer 2

尝试在<head>代码

之间添加元标记

<meta name="viewport" content="initial-scale=1">

window.innerWidth＆lt; = 480不起作用

2 个答案: