重新加载移动页面脚本响应

时间:2018-09-19 16:31:46

标签: javascript jquery responsive swiper

每次向下滚动页面时,在移动设备上如何解决?

(function($) {
    $(document).ready(function() {    
        var ww = document.body.clientWidth;    
        $(function() {
            if (ww > 769) {
                console.log(ww);
                $('.container_categories .swiper-container').removeClass().addClass('swiper-container-box');
                $('.container_categories .swiper-wrapper').removeClass().addClass('swiper-wrapper-box');
                $('.container_categories .swiper-slide').removeClass().addClass('swiper-slide-box');
                $('.container_categories .swiper-wrapper div').removeAttr('style');
            }
        });

        $(window).resize(function() {
            var ww1 = document.body.clientWidth;
            if (ww1 < 768) {
                window.location.href = document.URL;
            }
            else {
                $('.container_categories .swiper-container').removeClass().addClass('swiper-container-box');
                $('.container_categories .swiper-wrapper').removeClass().addClass('swiper-wrapper-box');
                $('.container_categories .swiper-slide').removeClass().addClass('swiper-slide-box');
                $('.container_categories .swiper-wrapper div').removeAttr('style');
                $('li').removeClass('open');
            }
        });    
    });
})(jQuery);

1 个答案:

答案 0 :(得分:0)

没关系:

       (function($) {
  $(document).ready(function() {

    //remove classes for responsive
    var ww = document.body.clientWidth;

    //to be there on page load(without resizing the browser, to get the responsive view)
    $(function() {
      if (ww > 769) {
        //alert("size" + ww);
        console.log(ww);
        $('.container_categories .swiper-container').removeClass().addClass('swiper-container-box');
        $('.container_categories .swiper-wrapper').removeClass().addClass('swiper-wrapper-box');
        $('.container_categories .swiper-slide').removeClass().addClass('swiper-slide-box');
        $('.container_categories .swiper-wrapper div').removeAttr('style');
      }
    });


    $(window).resize(function() {
      var ww1 = document.body.clientWidth; //to get the current width
      if (ww1 < 768) else {
        //removing not needed classes for responsive design
        $('.container_categories .swiper-container').removeClass().addClass('swiper-container-box');
        $('.container_categories .swiper-wrapper').removeClass().addClass('swiper-wrapper-box');
        $('.container_categories .swiper-slide').removeClass().addClass('swiper-slide-box');
        $('.container_categories .swiper-wrapper div').removeAttr('style');
        $('li').removeClass('open');
      }
    });

  });
})(jQuery);