我的问题是如何将类添加到响应式移动设备。我需要的是添加这个类“scrolled”来滚动事件,并在窗口宽度小于720px时添加到window.resize。例如:

$(document).ready(function () {
    $(window).scroll(function () {
        if ($(this).scrollTop() > 10) {
            $('nav').addClass('scrolled');
        }
        else {
            $('nav').removeClass('scrolled');
        }
    });
    var width = $(window).width();
    $(window).resize(function () {
        if (width <= '720px') {
            $('nav').addClass('scrolled');
        }
    });
})

body{
    height:2000px;
}
nav{
    width:100%;
    height:80px;
    background-color:#10de60;
    transition:all .4s ease-in-out;
}
nav.scrolled{
    height:60px;
    background-color:#ffd800;
    position:fixed;
    top:0;
    left:0;
    right:0;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<nav>
    my Nav
</nav>

最佳答案

尝试删除px

var width = $(window).width();
$(window).resize(function () {
    if (width <= 720) {
        $('nav').addClass('scrolled');
    }
});

关于javascript - 将类别添加到自适应移动,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/41582532/

10-09 16:03
查看更多