Нужно добавить к сайту параллакс эффект (двигая мышкой, сайт должен как бы двигаться по сторонам), подсказали подобные плагины
https://github.com/wagerfield/parallax и
stephband.info/jparallax, только проблема в том что все они завязаны на картинках в li.
т.е.
<ul id="scene">
<li class="layer" data-depth="0.00"><img src="layer1.png"></li>
<li class="layer" data-depth="0.20"><img src="layer2.png"></li>
<li class="layer" data-depth="0.40"><img src="layer3.png"></li>
<li class="layer" data-depth="0.60"><img src="layer4.png"></li>
<li class="layer" data-depth="0.80"><img src="layer5.png"></li>
<li class="layer" data-depth="1.00"><img src="layer6.png"></li>
</ul>
а если у меня подобная верстка:
<div style="background: url('.img1.png');width:980px;">контент 1</div>
<div style="background: url('.img2.png');width:980px;">контент 2</div>
<div style="background: url('.img3.png');width:980px;">контент 3</div>
<div style="background: url('.img4.png');width:980px;">контент 4</div>
то мне нужно подключать плагин (верстать) как-то так?
<ul id="scene">
<li class="layer" data-depth="0.00"><div style="background: url('.img1.png');width:980px;">контент 1</div></li>
<li class="layer" data-depth="0.20"><div style="background: url('.img2.png');width:980px;">контент 1</div></li>
<li class="layer" data-depth="0.40"><div style="background: url('.img3.png');width:980px;">контент 1</div></li>
<li class="layer" data-depth="0.60"><div style="background: url('.img4.png');width:980px;">контент 1</div></li>
</ul>
но ничего не работает. Кто сталкивался или видел пример, подскажите как быть?
Простой
