see responsive version

Scroll backward. Scroll forward.

This is not a slide-show but a widget that I originally built (mostly in raw javascript) as a daily-wine caddy for our executive bottle editor, Gunnar McNab. You can look backwards for a little while . . . but you can’t see tomorrow! Just like real life.
(See Responsive Version Here.)

FAQ

"Does this thing have any earthly use?" and other idle questions. Click here. Or here.

TC Duo

"I heartily endorse the Wunderwidget. You should too."
T. C. Segar, Brompton Cross
UNPAID ENDORSEMENT

Does this thing have any earthly use?

Yes, it fills a serious need. I thought the need was obvious until I found that some people just didn't "get it" at all. So here is the simple explanation:

It allows you to have NEW CONTENT appear EACH DAY, automatically. There are many reasons why you might want this. You might be building a news page. Or perhaps you have a module called "This Day In History" or "Whose Birthday Is it Today?" or "Planetary Aspects for Today."

For this kind of daily-update project, there are two must-haves:

1) Since your content is usually different each day, you must have each day's new content "go live" automatically when that day starts (midnight).

2) You want people to be able to look at yesterday's news, and last week's news, but not tomorrow's! You want to be able to keep editing tomorrow's content up to the last minute.

And most likely this is also important:
3) The solution has to be lightweight and easy to use.

There are content-management systems and blogging platforms that allow you to "publish" an article at some point in the future (e.g., WordPress, Drupal), but these are self-contained environments, not add-ons to your existing site.

Wunderwidget has two main pieces: the javascript itself, which you never have to open up or adjust; and the HTML wrapper that goes around your news page or module. To set up the widget in your own site, you need to provide your own content divs, and set a couple of basic parameters: How many days back do you want to be able to scroll in this calendar year? and If you can scroll back to the previous calendar year, how far back do you wish to scroll in that one? There is also a stylesheet, and some jQuery to enable simple transitions as you scroll from one day to another.

Why Isn't This Thing Just a Slideshow?

Because a simple javascript/css slideshow will not give you date-specific content, or today's news, every day.

If you don't need to provide date-specific content every day, a simple slideshow may be all you need. Personally I am very fond of Mike Alsup's cycle.js, a jQuery plugin that is lightweight and flexible, and has been implemented a thousand different ways around the inter-webs. (Get it here, along with other useful and fun projects.)

Why couldn't you build it in jQuery?

There is no jQuery plugin or function that returns the current date and day of year, and can count backwards (or forwards) from that point. The purpose of jQuery is to simplify the long, stringy, cumbersome parts of Javascript. The date methods of Javascript are already as basic as you can get, and cannot be reduced further.

For a similar reason, the Wunderwidget cannot be refashioned as a jQuery plugin without losing most of its utility. The closest approximation would be a jQuery plugin that would have you pick a date, whereupon it would return some content for that date. But this would be little different from a basic slideshow. It would not be able to count backwards and forwards from the date you initially select, nor would it "know" when it reached today's date and could no longer scroll ahead.

Does it use backbone.js?

This question was intended as a joke, but it brings up a good point. If you created a complex date-driven website that needed to keep track of many days' relationship to each other (a scheduling program, perhaps), then backbone.js might well be the way to go. But Backbone here would be overkill (as indeed it is in most implementations we see these days).

Ditto Angular.js?

It will, Oscar, it will.

Is this site "responsive"?

Not right now, because the example images do not adapt easily to mobile media, and most of the pages we link to have only limited responsivity. This is a good example of a website that needs to be substantially redesigned for mobile, and it shall be.


For further information, contact

Liz Houston at Wunderwidget Sales & Breeding: elizabeth.houston@wunderwidget.com

Back to the top!