How to simulate movement with Parallax.js?

五迷三道 提交于 2019-12-13 02:38:21

问题


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

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!