ここで紹介しているコードはPARALLAX || roXonのコードを基本に作成しています。元のコードを確認したい場合はPARALLAX || roXonのコードをご覧ください。 サンプル まずはサンプルで動きを確認してみてください。div要素内にマウスが入ると画像が動きます。 サンプルのコード サンプルの基本になっているコードを確認したい方はPARALLAX || roXonをご覧ください。 JQuery <script type="text/javascript"> $(document).ready(function(){ distance = 200;//画像の移動距離 sensitivity = 17;//移動時の滑らかさ var distHalf = distance / 2; var parW = $('#par').width(),//要素の横幅をピクセル単位で取得します
![マウスの動きに合わせて画像が動くパララックス効果](https://cdn-ak-scissors.b.st-hatena.com/image/square/62445586b1cdb211deb62fa7f810006b376a202a/height=288;version=1;width=512/http%3A%2F%2Fdetarame.moo.jp%2Fwp%2Fwp-content%2Fuploads%2F2012%2F10%2Fpara.png)