How to block JavaScript Scroll function in different screen widths

0

I have this script, it has the function of making a menu appear when there is some type of scrolling on the page, however I would like that from a certain page width this script would not be executed. I am learning JavaScript and could not find a solution to this problem.

$(function(){
        var floatingChat = $("#floatingChat");
        var floatingBar=$("#floatingBar");
        var cart=$(".cart");
        var search=$(".searchBox");
        var logo=$("#header h1");
        $(window).bind("scroll",function(){         
            if($(this).scrollTop()>130){
                floatingBar.fadeTo(300,1);
                floatingChat.fadeTo(300,1);
                cart.addClass("floating");
                search.addClass("floating");
                logo.addClass("floating");
            }
            else{
                floatingChat.stop(true).css("display","none");
                floatingBar.stop(true).css("display","none");
                cart.removeClass("floating");
                search.removeClass("floating");
                logo.removeClass("floating");
            }
            if ($(document).height() <= $(window).scrollTop() + $(window).height()) {
                floatingChat.stop(true).fadeOut(300,0);
            }
        });
    
asked by anonymous 08.05.2017 / 21:53

1 answer

0

Enter a if to check the screen size at your discretion, eg:

$(function(){
var floatingChat = $("#floatingChat");
var floatingBar=$("#floatingBar");
var cart=$(".cart");
var search=$(".searchBox");
var logo=$("#header h1");
var max = 762;
$(window).bind("scroll",function(){
   if($(window).width() > max){
   ...
   } 

JSFiddle

    
08.05.2017 / 22:04