Disable a FUNCTION on mobile

-2

Hello everyone, I want this scroll function to be disabled for mobiles, or it will only be active if the width of the screen is 1200px up.

$(window).scroll(function () {

// Movimento primeiro box vermelho
if ($(this).scrollTop() >= $("#box_img1").offset().top - $("#marcador_menu").offset().top) {
   $("#box_img1").stop().animate({"margin-right":"70px", "opacity":"1"},600);
   $("#box_text1").stop().animate({"margin-left":"100px", "opacity":"1"},600);
} else {
}
if ($(this).scrollTop() >= $("#box_img2").offset().top - $("#marcador_menu").offset().top) {
   $("#box_img2").stop().animate({"margin-left":"100px", "opacity":"1"},600);
   $("#box_text2").stop().animate({"margin-right":"-50px", "opacity":"1"},600);
} else {
}
if ($(this).scrollTop() >= $("#box_img3").offset().top - $("#marcador_menu").offset().top) {
   $("#box_img3").stop().animate({"margin-right":"50px", "opacity":"1"},600);
   $("#box_text3").stop().animate({"margin-left":"100px", "opacity":"1"},600);
} else {
}
if ($(this).scrollTop() >= $("#box_img4").offset().top - $("#marcador_menu").offset().top) {
   $("#box_img4").stop().animate({"margin-left":"100px", "opacity":"1"},600);
   $("#box_text4").stop().animate({"margin-right":"-50px", "opacity":"1"},600);
} else {
}
if ($(this).scrollTop() >= $("#box_img5").offset().top - $("#marcador_menu").offset().top) {
   $("#box_img5").stop().animate({"margin-right":"50px", "opacity":"1"},600);
   $("#box_text5").stop().animate({"margin-left":"100px", "opacity":"1"},600);
} else {
}
});
    
asked by anonymous 13.11.2015 / 18:07

3 answers

2

SOLUTION

$(window).scroll(function(){
    if ($(window).width() >= 1200){ 
        // do something here
    }   
});
    
13.11.2015 / 18:15
2

Enter your code within the following if :

if (window.innerWidth >= 1200) {
    //Seu code aqui =]
}

The same functionality as above, but this time in Jquery along with your code:

if ($(window).width() >= 1200) {
 $(window).scroll(function () {

  // Movimento primeiro box vermelho
  if ($(this).scrollTop() >= $("#box_img1").offset().top - $("#marcador_menu").offset().top) {
     $("#box_img1").stop().animate({"margin-right":"70px", "opacity":"1"},600);
     $("#box_text1").stop().animate({"margin-left":"100px", "opacity":"1"},600);
  } else}
  if ($(this).scrollTop() >= $("#box_img2").offset().top - $("#marcador_menu").offset().top) {
     $("#box_img2").stop().animate({"margin-left":"100px", "opacity":"1"},600);
     $("#box_text2").stop().animate({"margin-right":"-50px", "opacity":"1"},600);
  } else {}
  if ($(this).scrollTop() >= $("#box_img3").offset().top - $("#marcador_menu").offset().top) {
     $("#box_img3").stop().animate({"margin-right":"50px", "opacity":"1"},600);
     $("#box_text3").stop().animate({"margin-left":"100px", "opacity":"1"},600);
  } else {}
  if ($(this).scrollTop() >= $("#box_img4").offset().top - $("#marcador_menu").offset().top) {
     $("#box_img4").stop().animate({"margin-left":"100px", "opacity":"1"},600);
     $("#box_text4").stop().animate({"margin-right":"-50px", "opacity":"1"},600);
  } else {}
  if ($(this).scrollTop() >= $("#box_img5").offset().top - $("#marcador_menu").offset().top) {
     $("#box_img5").stop().animate({"margin-right":"50px", "opacity":"1"},600);
   $("#box_text5").stop().animate({"margin-left":"100px", "opacity":"1"},600);
  } else {}
 });
}

As an additional information, another interesting for mobile is comparing whether there is a touch on the device:

if(('ontouchstart' in window)){
   //O code aqui sera executado apenas em dispositivos que possuem Touch Screen
}
    
13.11.2015 / 18:20
1

You could do as follows:

$(window).resize(function() {

  if ($(window).width() > 1200) {
    $(window).scroll(myFunction);
  } else {
    $(window).unbind('scroll');
  }

});

var myFunction = function() {

  // Movimento primeiro box vermelho
  if ($(this).scrollTop() >= $("#box_img1").offset().top - $("#marcador_menu").offset().top) {
    $("#box_img1").stop().animate({"margin-right":"70px", "opacity":"1"},600);
    $("#box_text1").stop().animate({"margin-left":"100px", "opacity":"1"},600);
  } else {
  }
  if ($(this).scrollTop() >= $("#box_img2").offset().top - $("#marcador_menu").offset().top) {
    $("#box_img2").stop().animate({"margin-left":"100px", "opacity":"1"},600);
    $("#box_text2").stop().animate({"margin-right":"-50px", "opacity":"1"},600);
  } else {
  }
  if ($(this).scrollTop() >= $("#box_img3").offset().top - $("#marcador_menu").offset().top) {
    $("#box_img3").stop().animate({"margin-right":"50px", "opacity":"1"},600);
    $("#box_text3").stop().animate({"margin-left":"100px", "opacity":"1"},600);
  } else {
  }
  if ($(this).scrollTop() >= $("#box_img4").offset().top - $("#marcador_menu").offset().top) {
    $("#box_img4").stop().animate({"margin-left":"100px", "opacity":"1"},600);
    $("#box_text4").stop().animate({"margin-right":"-50px", "opacity":"1"},600);
  } else {
  }
  if ($(this).scrollTop() >= $("#box_img5").offset().top - $("#marcador_menu").offset().top) {
    $("#box_img5").stop().animate({"margin-right":"50px", "opacity":"1"},600);
    $("#box_text5").stop().animate({"margin-left":"100px", "opacity":"1"},600);
  } else {
  }

});
    
13.11.2015 / 18:36