滚动动画在mac book retina中不起作用

时间:2017-04-21 05:31:48

标签: javascript jquery macos retina-display

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

以下是网络链接: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"});
      }
    });
  };
});

请帮忙。感谢

1 个答案:

答案 0 :(得分:0)

案件已解决。

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

$(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"});
      }
    });
  };
});