How to block Scroll Javascript function on different screen widths

Asked

Viewed 77 times

0

I am with this script, it has the function to make a menu appear when there is some kind of scrolling on the page, however I would like that from a certain width of page this script was not executed. I’m learning JavaScript and I couldn’t 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);
            }
        });

1 answer

0


Put a if to check the screen size as per your criteria, example:

$(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

Browser other questions tagged

You are not signed in. Login or sign up in order to post.