问题
I'm trying to simulate movement with Parallax.js in order to test for ways to improve its performance.
But how do I loop back and forth between 0
, 0.5
and 1
on Parallax.js' originX
and originY
in a way that would cause a circular motion?
http://jsfiddle.net/frank_o/amvvkm9z/
Pseudo-code:
var scene = $('#scene');
scene.imagesLoaded(function() {
var circularMovement = [
[0,0],
[0.5,0],
[1,0],
[1,0.5],
[1,1],
[0.5,1],
[0,1],
[0,0.5]
];
// Initiate Parallax
scene.parallax({
originX: 0,
originY: 1
});
circularMovement.each(function() {
scene.parallax('origin', N, N);
});
scene.masonry({
itemSelector: '.layer'
});
});
HTML:
<ul id="scene">
<li class="layer" data-depth="0.00">
<img src="http://lorempixel.com/50/50">
</li>
<li class="layer" data-depth="0.20">
<img src="http://lorempixel.com/50/50">
</li>
...
</ul>
来源:https://stackoverflow.com/questions/27070943/how-to-simulate-movement-with-parallax-js