スクロール時に画像を回転させるためにこのコードを使用していますが、うまく機能しています:
<script>
$(window).scroll(function() {
var theta = $(window).scrollTop() % Math.PI;
$('#leftgear').css({ transform: 'rotate(' + theta + 'rad)' });
$('#rightgear').css({ transform: 'rotate(-' + theta + 'rad)' });
});
</script>
私のサイトは水平方向にスクロールするので、.scrollTop の代わりに .scrollLeft を使用します。このコードはhttp://demosthenes.info/blog/718/Rotating-Elements-With-Page-Scroll-In-JQueryから取得しました。
このサイトの例には 2 つの画像があります。それらは反対方向に、異なる速度で回転しています。どうすればこれを達成できますか?デモ サイトのソースを調べたところ、-webkit-transform. ひょっとしてこれが関係してるの?誰か助けてくれませんか?
画像を反対側に回転させ、より遅い速度で回転させたい.