滚动动画在Mac Book Retina中不起作用



菜单栏和图像横幅的动画在Mac Book Retina显示中不起作用。但是它在没有视网膜的正常显示器中起作用。我会添加触发器控制台,但在滚动时没有显示任何内容。

这是Web链接:http://sarichem.com/html

这是代码:

$(window).ready(function() {
  var pageWidth = $(window).width();
  if (pageWidth > 1281) {
    $(window).on('scroll',function() {
      var amount = $(window).scrollTop();
      var amount2 = 1-(amount/10000);
      console.log(amount2);
      $(".slideanimate").css({"-webkit-transform": 'scale(' + amount2 + ')', "-moz-transform": 'scale(' + amount2 + ')', "transition": "all 0.3s"});
      if($(window).scrollTop() > 700) {
      $(".navhome1").css({"-webkit-opacity": "0", "-moz-opacity": "0", "opacity": "0"});
      } else {
        $(".navhome1").css({"-webkit-opacity": "1", "-moz-opacity": "1", "opacity": "1"});
      }
    });
  };
});

请帮忙。谢谢

案例已解决。

我正在添加桌面检测。这是完整的代码:

$(window).ready(function() {
  var pageWidth = $(window).width();
  var istablet = (/ipad|android|android 3.0|xoom|sch-i800|playbook|tablet|kindle/i.test(navigator.userAgent.toLowerCase()));
  var isDesktop = (function() {
    return !('ontouchstart' in window) // works on most browsers 
    || !('onmsgesturechange' in window); // works on ie10
  })();
  window.isDesktop = isDesktop;
  if (isDesktop || istablet) {
     $(window).on('scroll',function() {
      var amount = $(window).scrollTop();
      var amount2 = 1-(amount/10000);
      console.log(amount2);
      $(".slideanimate").css({"-webkit-transform": 'scale(' + amount2 + ')', "-moz-transform": 'scale(' + amount2 + ')', "transition": "all 0.3s"});
      if(amount > 700) {
      $(".navhome1").css({"-webkit-opacity": "0", "-moz-opacity": "0", "opacity": "0"});
      } else {
        $(".navhome1").css({"-webkit-opacity": "1", "-moz-opacity": "1", "opacity": "1"});
      }
    });
  };
});

相关内容

  • 没有找到相关文章

最新更新