How to create gear parallax effect?

360 views Asked by At

I am programming a website. On the sides of the document, I was planning on having half-gears fixed on the page (img{position:fixed;}) that would rotate when scrolled either up or down. I understand that this could be a use of parallax scrolling.

After hours of trying to create this effect with various techniques, I have been unsuccessful. Does anyone know of a way I can create this affect using CSS3, jQuery, Adobe Muse or Adobe Edge Animate?

1

There are 1 answers

0
Adam Joseph Looze On

First you built the gear in edge animate. auto play and using the rotate keyframe. Then placed in muse you pin to top, and under scroll effects you click advance by pixels. Check out my tutorial with demo here.

http://gearscroll.businesscatalyst.com/index.html

I just put this together real quick for you. If you want i would be happy to send you the animation and muse file.