Simple OOCSS Slideshows

I read this article recently, and decided to solve the problem the author proposes in point #3 using OOCSS techniques.

Here you go: OOCSS Slideshows.

You might be saying, “Good grief, all that CSS is overkill!”, and be tempted to think that just using image.style.display = 'none' is good enough. Try implementing those 3 effects in plain Javascript … you probably wouldn’t get it right—I know I probably wouldn’t.

Or maybe you’re thinking that you’d just use jQuery, Dojo, or your favorite effects library to do it. Putting aside the fact that the original interview question stipulated no libraries, the advantage of an OOCSS approach, as I’ve written about at length before, is separation of concerns, and all its related benefits.

Using an MVC and OOCSS approach puts control of the slideshow transitions into the hands of the designer, and changes to the transitions require zero Javascript changes.