Question

我正在使用以下代码来激活jQuery函数，该函数在滚动超过800宽度时将隐藏顶部栏。我遇到的问题是，只有当它从桌面大小缩小时才会激活，然后当它移回桌面大小时，它将继续工作在大于800的宽度上。如何只在我选择的宽度上进行此工作，然后停止/开始工作。

编辑。为了澄清，当页面从桌面大小制作成SMALLER时，它会起作用，然后它会再次运行，直到它再次超过800，在这种情况下，它最终将用于桌面+更大的大小。回去，它将停止工作。我们需要这个一次开火，当它超过时停止工作，只有当宽度通过时才会触发，这是我认为在我的代码中发生的事情！

function toggleBar(){
        var mywindow = $(window);
        var mypos = mywindow.scrollTop();
        var up = false;
        var newscroll;
        mywindow.scroll(function () {
            newscroll = mywindow.scrollTop();
            if (newscroll > mypos && !up) {
                $('header#header-top').stop().slideToggle();
                up = !up;
                console.log(up);
            } else if(newscroll < mypos && up) {
                $('header#header-top').stop().slideToggle();
                up = !up;
            }
            mypos = newscroll;
            });

并在我的文档中加载。

 $(window).resize(function() {
                var pageWidth = $(window).width(); 
                if ($(window).width() < 800){
                    toggleBar();
                    $('#header#header-top').attr('href','../css/main.css');
                }

            });

Answer 1

在你的代码中，你似乎错过了你的toggleBar的'）'，我认为这只是一个错字，但想要检查。
我创建了一个快速的jsfiddle，它的工作方式正如您所期望的那样。 JSFiddle

这让我觉得你在其他地方有代码可能会搞砸一切或者你的浏览器搞砸了。

尝试使用document.body.scrollTop = 0;代替ScrollTop，因为并非所有浏览器都支持。

窗口调整大小宽度不正常jQuery

1 个答案: