移动版 jQuery 滚动

Question

我需要有关 Jquery 滚动功能的帮助。我想让滚动顶部位置在手机、平板电脑上 >= 300，在桌面上 >= 700。有谁知道怎么做？先感谢您。

这是我的代码：

$(window).scroll(function(){

  if ($(window).scrollTop() >= 700) {

      $('.content-item.odd').addClass('fixed-header');

      $('.content-item.odd').css({"position":"fixed","width":"100%","top":"90px","border-top":"1px solid #fff"});

  }

    else {

      $('.content-item.odd').removeClass('fixed-header');

      $('.content-item.odd').removeAttr("style");

  }

});

Answer 1

您可以使用 jQuery 的.width()函数来获取窗口宽度并围绕您的函数构建一个 if 语句，如下所示：$(window).scroll(function(){//here we check the viewport widthif($(window).width() < "1024"){//if the viewport width is less then 1024 scrolltop is 300&nbsp; if ($(window).scrollTop() >= 300) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;$('.content-item.odd').addClass('fixed-header');&nbsp; &nbsp; &nbsp; &nbsp; $('.content-item.odd').css({"position":"fixed","width":"100%","top":"90px","border-top":"1px solid&nbsp; &nbsp; #fff"});&nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; else {&nbsp; &nbsp; &nbsp; &nbsp; $('.content-item.odd').removeClass('fixed-header');&nbsp; &nbsp; &nbsp; &nbsp; $('.content-item.odd').removeAttr("style");&nbsp; &nbsp; }}else{&nbsp; &nbsp; if ($(window).scrollTop() >= 700) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;$('.content-item.odd').addClass('fixed-header');&nbsp; &nbsp; &nbsp; &nbsp; $('.content-item.odd').css({"position":"fixed","width":"100%","top":"90px","border-top":"1px solid&nbsp; &nbsp; #fff"});&nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; else {&nbsp; &nbsp; &nbsp; &nbsp; $('.content-item.odd').removeClass('fixed-header');&nbsp; &nbsp; &nbsp; &nbsp; $('.content-item.odd').removeAttr("style");&nbsp; &nbsp; }&nbsp; }});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>