滚动上的jQuery揭示在iOS上不起作用

时间:2017-04-06 09:08:38

标签: javascript jquery ios scroll onscroll

我正在尝试在滚动功能上构建滚动显示和动画效果。它在桌面上运行良好,但在iOS上不起作用。我找不到这个问题,所以我希望你能指出我的解决方案。

Codepen版本:http://codepen.io/InformisMentis/pen/peKvjw

The code 
// Height of window
var windowHeight = $(window).height();
// Scroll status
var windowScrollPosTop = $(window).scrollTop();
// Height of window + scoll status
var windowScrollPosBottom = windowHeight + windowScrollPosTop;


// function with default settings
$.fn.revealOnScroll = function (animatie="fadeIn", afstand=100) {
// Height of window
windowHeight = $(window).height();
// Scroll status
windowScrollPosTop = $(window).scrollTop();
// Height of window + scoll status
windowScrollPosBottom = windowHeight + windowScrollPosTop;

// Function call
return this.each(function() {

    // Get offset
    var objectOffset = $(this).offset();
    // Get top pos element
    var objectOffsetTop = objectOffset.top;

  // hide element with class hidden
  if (!$(this).hasClass("hidden")) {
    $(this).addClass("hidden");
  }

// Add complete class so it  wont loop
if (!$(this).hasClass("complete")) {
  if (windowScrollPosBottom > objectOffsetTop + afstand) {
  $(this).addClass("animated show complete " + animatie + " ");
   }
   }
   });
  }; // end function

$.fn.animateOnScroll = function (animatie="fadeIn", afstand=100) {
return this.each(function() {
    var objectOffset = $(this).offset();
    var objectOffsetTop = objectOffset.top;
if (!$(this).hasClass("complete")) {
  if (windowScrollPosBottom > objectOffsetTop + afstand) {
  $(this).addClass("animated complete " + animatie + " ");
   }
   }
  });
  }; // end function

// Call function on scroll with animatie.css class names
$(document).scroll(function() {
$(".placerholder3").animateOnScroll("bounce", 200);
$(".placerholder4").revealOnScroll("slideInLeft", 300);
});

0 个答案:

没有答案