search

janpaepke / ScrollMagic

The javascript library for magical scroll interactions.
http://ScrollMagic.io
Other
14.9k stars 2.17k forks source link

Am I doing it right ? #317

Closed Lynesth closed 9 years ago

Lynesth commented 9 years ago

Hey there !

Sorry to ask that here, but I thought it could be a good place to do so. I'm more of a backend person, not much JS and all but I have to make a website which should look like http://makeyourmoneymatter.org/ along with questions that the user has to answer before continuing.

There will be kind of a funny caracter in the middle of the screen who will suffer each time he doesn't get a correct answer.

I was just wondering if I'm using things the right way and all for now : http://click.tweefox.nc/ (those graphics are just for the purpose of testing SM and GSAP).

Thank you all in advance.

Regards,

Lyn.

PS: Excuse my english.

janpaepke commented 9 years ago

Hi Lyn, That is a bit of a broad question. :) But here's some hints: Don't modify background-position as it's not hardware accelerated. Make an element with a child element and then move it using transforms. Same goes for the clouds: use x instead of left. As you get more elements you'll see why. :)

The rest of your code looks fine. Remember that you don't have to squeeze everything in one giant timeline (you can, but you don't have to). Use multiple scenes to organize your code.

Also check out tweenChanges, as this may give you that slight easing, that your other example offers: http://scrollmagic.io/docs/animation.GSAP.html#Scene.tweenChanges

janpaepke commented 9 years ago

Hi Lyn, did this answer your question?

Lynesth commented 9 years ago

Hi janpaepke !

Sorry I took a long time to come back. Thank you for your answer it's been usefull. I'm gonna start working on this in a couple of weeks, so I may have to ask you more questions ^^

(I've been playing just a little bit with it : http://click.tweefox.nc/mymm.html)

If you don't mind keeping this issue open then it'll be easy to keep bothering you ;)

Regards,

Lyn.

Lynesth commented 9 years ago

Hey there,

I am having issues in IE with the link I previously gave you. Everything is flickering and all, nothing's smooth at all. Tried using force3D in my timeline, but didn't make any difference.

Anyway idea what I can do ?

Regards,

Lyn.

janpaepke commented 9 years ago

which IE exactly?

Lynesth commented 9 years ago

Currently using IE 11.0.9600.17280 under Win7 to be specific.

By the way, is there any way to make scrollmagic work with IE8 ?

Lynesth commented 9 years ago

Looking around I found this : https://coderwall.com/p/hlqqia/ie-fix-for-jumpy-fixed-bacground which makes it a LOT better.

There's still a small glitch if I scroll up quiclky from the bottom, as it show a quick blank space at the top but appart from that, no more jumping around :)

Lynesth commented 9 years ago

Ok so I started working on this thing. It really is a first for me, and I'm not really a front-end dev. Anyway, here is the current work in progress : http://demo.tweefox.nc/oldminisite/index.html

Some images are not at the right size, I am aware of that, still waiting for the new ones :)

Is this the "right" way of doing things ? It seems... "ok" but also messy. I don't know really, am I overdoing something or what ?

Thanks again for your answer, and for your awesome lib !

Regards,

Lyn.

Edit : Modified link to final version.

janpaepke commented 9 years ago

Hi Lyn, the page doesn't seem to exist anymore. please make sure to only post permanent links, as defined in the support guidelines.

Lynesth commented 9 years ago

Hey there !

Yes sorry I had to remove it. I finally finished working on this, and here is the final work : http://demo.tweefox.nc/oldminisite/index.html (This link might get removed in the future too, but not anytime soon).

I don't know, if it's how i should have been done, but it's working as intended, soooo....

Thank you again for your script !

Lyn.

janpaepke commented 9 years ago

no worries. please try to keep it up as long as possible.

nirbhaynaruka commented 5 years ago

Hey there !

Yes sorry I had to remove it. I finally finished working on this, and here is the final work : http://demo.tweefox.nc/oldminisite/index.html (This link might get removed in the future too, but not anytime soon).

I don't know, if it's how i should have been done, but it's working as intended, soooo....

Thank you again for your script !

Lyn.

hey, I'm a freelancer and actually I got a new project where the client is asking to make a website something like makeyourmoneybetter.org , is there is any possibility that I can take a look at your repositories of updated http://demo.tweefox.nc/oldminisite/index.html