Labo-X

jParallax est un module pour jQuery qui permet de simuler de la 3D en superposant plusieurs images (format png avec transparence) et en les faisant bouger en fonction de la position de la souris au dessus de ces images. Pour avoir un exemple parlant vous pouvez aller sur Dezignus et bouger la souris sur le header.

Site de jParallax

Des démos

L’utilisation est relativement simple.

Code html :

<ul id= »parallax »>
<li><img src= »images0.png » alt= »"/></li>
<li><img src= »images1.png » alt= »"/></li>
<li>…</li>
</ul>

Code javascript :

<script type= »text/javascript » src= »jquery-latest.pack.js »></script>
<script type= »text/javascript » src= »jquery.jparallax.js »></script>
<style type= »text/css » media= »screen »>
#parallax{position: relative; overflow: hidden; width: Npx; height: Npx;}
</style>
<script type= »text/javascript »>
$(document).ready(function () {
$(‘#parallax’).jparallax();
});
</script>