0

我有 34 张照片,我希望滚动的速度比使用 javascript 的页面稍快一些,我目前正在使用scrollingParallax 插件来实现。然而,当我切换到我的 ipad 来查看它时,它变得相当粗略!我想让网站响应,因为我妈妈只会在那里看它!我想知道这种抖动是由于我的低效编码、旧插件还是我只是个白痴造成的!

我基本上循环进入插件 34 次,我确信这效率不高,但时间和理解有限,我想我会把它扔到所有知识 stackoverflow 的字体中!

这是我正在使用的循环:

/* Photo sprite alignment and scroll   */
for(var i=0; i<34; i++){
var j = '#photo' + (i+1);
$(j).scrollingParallax({staticSpeed : 2.2,staticScrollLimit : false, loopIt : false});
};

几张照片的CSS:

.photos{position: fixed; z-index:-1;}

#photo1{top:900px; left:10px;}
#photo2{top:1100px; right:10px;}
#photo3{top:1300px; left:10px;}
#photo4{top:1500px; right:10px;}
#photo5{top:1700px; left:10px;}
#photo6{top:1900px; right:10px;}
#photo7{top:2100px; left:10px;}
#photo8{top:2300px; right:10px;}

一些照片的html:

<div class="photos">
<img src="img/1.png" id="photo1">
<img src="img/2.png" id="photo2">
<img src="img/3.png" id="photo3">

非常感谢您的帮助!

4

1 回答 1

0

Shmiddty 提供了一种更好的调用函数的方法,但最终 iOS 只是没有足够快地运行 jquery scrollingParrallax,所以我最终在 iOS 上隐藏了这个类。

// 优化:将引用存储在事件处理程序之外: var $window = $(window);

function checkWidth() {
    var windowsize = $window.width();
    if (windowsize > 1250) {
        //if the window is greater than 1250px wide then turn on parallax scrolling..
                    $('.fixedPhotos').addClass('hidden');
                    $('.photos img').removeClass('hidden');
            }else{
                    $('.fixedPhotos').removeClass('hidden');
                    $('.photos img').addClass('hidden');
            }
}
// Execute on load
checkWidth();
// Bind event listener
$(window).resize(checkWidth);
于 2013-01-12T19:37:19.347 回答