#9: Starry Night: 3D Background with the Parallax Effect

Using three layers of alpha transparent PNG files, we can can create a pseudo 3-dimensional looking background for a web page. This screencast covers how to do that from start to finish. Since Internet Explorer 6 and under do not support alpha transparency in PNG's, this screencast also covers how to create a warning message that will display only in those browsers.

Links from video:

Comments

  1. User Avatar
    shadyyx
    Permalink to comment#

    Who is normally resizing the browser? It would be nice if that parallax effect come in place while scrolling…

    • User Avatar
      CiNiTriQs
      Permalink to comment#

      We have to see this in the light of the moment this video was set up. couple of years ago ;) (he’s even talking about ie5 n 6 while nowadays we are even discarding IE8 ;) ) nonetheless, was a nice refresh of some tricks here. parallax has found it’s place nowadays in way fancier forms.

Posting Code

You may write comments in Markdown. This makes code easy to post, as you can write inline code like `<div>this</div>` or multiline blocks of code in triple backtick fences (```) with double new lines before and after.

Code of Conduct

Absolutely anyone is welcome to submit a comment here. But not all comments will be posted. Think of it like writing a letter to the editor. All submitted comments will be read, but not all published. Published comments will be on-topic, helpful, and further the discussion or debate.

Want to tell us something privately?

Feel free to use our contact form. That's a great place to let us know about typos or anything off-topic.

Submit a Comment

icon-closeicon-emailicon-linkicon-menuicon-searchicon-tag