HTML5ish.com

scroll down

Experimenting with Parallax effects part 2

Parallax scrolling effects are hip and trendy. So let's just create some, no matter how distracting they may be, not regarding the design of all of this, only for the sake of creating parallax scrolling effects. This time playing around with different effects and animations like several background, appearing divs, rotating images.. to check it out, just scroll down.

Parallax Scrolling effects once again with skrollr

In this exercise I will again use a Javascript framework for parallax scrolling: skrollr. So please go ahead and scroll further down (and up again if you want) to experience the several scrolling backgrounds, and all the other fancy stuff.

Appearing paragraphs

This paragraph is only getting visible via scrolling. And if the page gets scrolled a bit more, the background of this paragraph changes, to state the IMPORTANCE of this message here!

There is something missing...

Scrolling background issues

I experienced one issue with the height of the background effect. I guess that it's an css issue, which I couldn't solve right away. Since this was not the focus of this experiment, I left it be. Maybe I am coming back to this...

As always, I will still have to test if this works on an iPad and mobile.

Conclusion

On the one hand, skrollr is easy to use and offers you pretty quick access to parallax scrolling. It is also not limited to this. You can basically animate every css property. This is a good thing, but as experienced on this page, you have to use it with caution. It can quickly become the <Blink> tag. But it makes fun, no questions!

On the iPad I experienced some issues with the change of colors - this runs not as smoof as in the browser.