Question

我正在开发一个具有大量动画效果的Wordpress网站 - 更改标签上的淡入和淡出等。其中一个我在元素处于视口中时从底部滑入框中。我正在使用这个脚本：

function checkVisible() {
    var elm = this;
    var eval = eval || "visible";
    var vpH = $(window).height(),
        st = $(window).scrollTop(), 
        y = $(elm).offset().top,
        elementHeight = $(elm).height();

    if (eval == "visible") return ((y < (vpH + st)) && (y > (st - elementHeight)));

}



$(window).scroll(function(){ 
 $('.module').filter(checkVisible).addClass('come-in');
});

$( document ).ready(function() {
  $('.module').filter(checkVisible).addClass('come-in'); 
});

它不是我的，我在Stackoverflow上发现了它。问题是，它工作了一段时间，但一段时间后它开始变得奇怪：在大多数子页面中，它只是添加了“进入”的子页面。甚至没有检查＆＃39;模块＆＃39;是否在视口中。在＆＃39; post＆＃39;它工作的页面..但从底部滚动到顶部。

正如我读到的那样，很多问题可能是由双jquery CDN引起的，但我不认为这是问题所在：

    <head>
<meta charset="utf-8" /> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>OsiemZero</title>
<script type="text/javascript">document.body.className+='animate-in'</script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="http://serwer1460278.home.pl/osiemzero_wp/wp-content/themes/osiemzero/js/animations.js"></script>
<script src="http://serwer1460278.home.pl/osiemzero_wp/wp-content/themes/osiemzero/js/custom_css.js"></script>
<script type='text/javascript' src='http://serwer1460278.home.pl/osiemzero_wp/wp-content/plugins/ml-slider/assets/sliders/flexslider/jquery.flexslider-min.js?ver=3.3.6'></script>
<link rel='stylesheet' id='metaslider-flex-slider-css'  href='http://serwer1460278.home.pl/osiemzero_wp/wp-content/plugins/ml-slider/assets/sliders/flexslider/flexslider.css?ver=3.3.6' type='text/css' media='all' property='stylesheet' />
<link rel="stylesheet" href=" http://serwer1460278.home.pl/osiemzero_wp/wp-content/themes/osiemzero/css/font-awesome.min.css">
<link rel="stylesheet" href="http://serwer1460278.home.pl/osiemzero_wp/wp-content/themes/osiemzero/css/styles.css">



</head>

我尝试了很多脚本来检查元素是否在视口中（甚至是jquery插件），但是它们具有相同的效果，所以可能不是问题。

感谢您提供任何帮助。

奇怪的jquery＆＃39; viewport＆＃39;行为

0 个答案: