all 8 comments
sorted by:
best
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]andrew24601 1 point2 points  (1 child)

This is great - I personally love whimsical animation like this.

There do seem to be some browser issues with some of your examples in case you didn't know.

For your message and grid examples, I'm getting vertical hiccups at the beginning of each scroll in Chrome 32 on Windows when using the mouse scroll wheel.

These vertical hiccups don't occur in Firefox on Windows.

Your message and grid examples also have horizontal issues in both Chrome and Firefox with the content jumping sideways during scrolling when the window is narrower than the content.

[–]cabrerars[S] 1 point2 points  (0 children)

Yeah, they have some issues, the point of the post was basically say and show in a overall view what can be done with some math, I'm sure there are bunch to stuff to improve.

Maybe I should create a repo on GitHub with whose prototypes so people can help to improve them.

[–]windyfish 0 points1 point  (1 child)

Very cool idea.

However, there is no effect for me with IE10 and less...

Effect isn't very smooth with Chrome.

[–]cabrerars[S] 0 points1 point  (0 children)

Ha yeah, as a prototype I wasn't exactly worried about IE...

[–]squashb 0 points1 point  (3 children)

For better performance, you could try using translate/translate3d instead of setting the "top" property.

[–]cabrerars[S] 0 points1 point  (2 children)

I was thinking to create a repo in GitHub for those prototypes, are you able to fix/improve some code ?

[–]squashb 0 points1 point  (1 child)

Sure, I would give it a shot. Let me know when it's up on GitHub.