Hi guys,
I am fairly new to webflow and I had a question in regards to applying Javascript to an image.
Heres my site:
https://preview.webflow.com/preview/aosc-mockup?preview=6c7fababa8e0c8daf40e5d22e57a4c17
My goal is to have the land image (earth) rotate like a gear when scrolling. Specifically like this:
I used the following code and put it in the home page site settings before the tag but it doesn’t seem to work and I was hoping one of you could help me out!
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<style>
$(window).scroll(function() {
var theta = $(window).scrollTop() / 10 % Math.PI;
$('#landimage').css({ transform: 'rotate(' + theta + 'rad)' });
});
</style>
Thanks!