視差効果を使用しようとしているヘッダー画像があるサイトがあります。私はこれを達成するために、次のJSを使用していjQuery視差画像がスムーズでないときにマウスホイールでスクロールする
:私はこのフィドルから例を使用
$(window).scroll(function() {
var scrolledY = $(window).scrollTop();
$('#container').css('background-position', 'left ' + ((scrolledY)) + 'px');
});
:クリックとスクロールバーをドラッグすることで、ページを下にスクロールしたとき
http://jsfiddle.net/QN9cH/1/
これは素晴らしい作品しかし、私がマウスホイールでスクロールすると、画像が大きく飛び出し、滑らかではありません。
私は多くの研究を行ってきたと、そのようなここで一つとして解決策を試してみました: Javascript - Smooth parallax scrolling with mouse wheel
しかし、私は私の実装で、この作業を取得することはできませんよ。私はスムーズなスクロールのためにいくつかのjqueryライブラリを試してきましたが、それらを正しく動作させることができませんでした。
マウスホイールでスクロールできる方法は、スクロールバーをクリックしてドラッグして手動でスクロールした場合と同じですか?
jqueryのスムーズなスクロールプラグインがあります。 https://github.com/nathco/jQuery.scrollSpeed、https://github.com/fatlinesofcode/jquery.smoothwheel、https://github.com/simov/simplr-smoothscroll(デモをチェックしてください) – dekkard