treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Slider with Sliding Backgrounds

Among the many super nice design features of the Yahoo! Weather app for iOS is the transition between city screens. The background image doesn’t just move away as the screen moves from one screen to the next, the background image itself slides. It appears to be hiding some of the “old” screen and revealing more of the “new” screen those closer you have it to being in full view.

Let’s try and pull it off on the web.…

Read Article →

Photo Swivel

The following is a guest post by Alex Young (@the_alexyoung). Alex has created a simple technique to “rotate” the subject of a photo simply by hiding and showing multiple stacked photographs taken at different angles. Enjoy!

Read Article →

Media Query Change Detection in JavaScript Through CSS Animations

The following is a guest post by Alessandro Vendruscolo. Media queries are relevant to both CSS and JS. The need and desire to manage those in one place is real. There have been some clever ways to do this, like Jeremy Keith’s Conditional CSS. But in that case, the onus is on you to test after window state changes. You can get a true listener with MediaQueryList, but then you’re maintaining the media queries in both places again.

Read Article →

Naming Media Queries

It would be pretty cool if we could do this someday in CSS. The best idea for it that I’ve come across is to define it in a <meta /> tag in the <head></head>. That way (perhaps) CSS could use it and JS could use it. Like window.matchMedia(nameOfMyMediaQuery) or @media (nameOfMyMediaQuery) { }. But since we can’t, Sass has our back. Now the question is, how do we name them?…

Read Article →

More Blog Posts →