- This topic is empty.
August 1, 2014 at 3:13 pm #177249
Im trying to figure out how to use this for a parallax animation site im working on. I cant for the life of me figure out how to set this up…basically there is a start and an end point and also a trigger element used to animate the element based on the triggers point in between the start and end…..heres my basic demo example that i cant even get working correctly: http://codepen.io/anon/pen/HkdJE and heres the link to scrollmagic https://github.com/janpaepke/ScrollMagicAugust 1, 2014 at 3:22 pm #177251
You came to the right place. I’ve been using ScrollMagic since it was SuperScrollorama.
I can tell you that your first problem is that your body is not tall enough to facilitate any scrolling at all. There’s not even a scroll bar. Make your body like 3000px or something arbitrary and long for testing.
Your other problem is, your two tweenable elements are in the upper left hand corner. So, they’re gone as soon as we start scrolling. We have no idea if the tween is working… because we can’t see them. Do you get what I’m saying?August 1, 2014 at 3:33 pm #177254
Let me mess with this for a sec.August 1, 2014 at 3:35 pm #177255
yesssssssss….ur amazingAugust 1, 2014 at 4:34 pm #177259
Started a new pen:
I created a little naming convention to help you understand. Finger, trigger and target. Any other questions… just ask. Also, make sure to include GSAP (Greensock).August 1, 2014 at 5:03 pm #177260
thats awesome….i actually completely understand that lol ……but question…..why when i add another element and another animation the same way u did….using the same trigger element….does it not work http://codepen.io/anon/pen/wiLuBAugust 1, 2014 at 5:06 pm #177261
its like jumpy and not bueno…..lol im really trying to learn this so excuse my hundred questions but also is that the most efficeint way to have multiple animations…..just keep adding tween & scene combos like that for every animation?August 1, 2014 at 5:09 pm #177262
You need to use timeline max OR syntax could be off. Fork this pen and show me what you’ve got.August 1, 2014 at 5:11 pm #177263August 1, 2014 at 5:18 pm #177264
scrollmagic really doesnt wanna work for me lolAugust 1, 2014 at 5:36 pm #177266
wait!! i got it!!!! thank you so much!! lol ok….last and final question while i have someone who clearly knows everything…….i need this to work for mobile obv…..i need to use iscroll ive been told….whats the basic procedure for this….ive read i need to use a container div and iscroll……would u happen to know this also?August 1, 2014 at 6:05 pm #177267
Give me a few hours to look into that.August 1, 2014 at 6:06 pm #177268
I was under the impression that ScrollMagic worked on mobile out of the box.August 1, 2014 at 6:14 pm #177269
it works on mobile but it doesnt support the momentum of a scroll…meaning it shows the beginning and end of the animation…not the in between….which makes it look choppy and horribleAugust 1, 2014 at 7:16 pm #177273
So you have to use what now? iScroll?