Looking for inspiration: examples of a web calendar with fancy “pop-up” details for each day

I’m designing a web calendar application. The starting view shows a small-ish calendar with a number of events listed on each day. The calendar cell for today, for example, contains the words “March 10” and “3 Events”. When the user clicks on the day, I want some kind of dynamic menu or box to appear with details about those 3 events. I want this “detail view” to be on the same page, overlayed on top of the existing web page elements.

The problem is I’m having a total mental block while trying to decide what that “detail view” menu or box should look like. I’m wondering, does anyone know of any calendars or similar web apps that use this functionality that I could look at to get inspired? I’d appreciate any help. My searches haven’t turned up anything.


Sounds like a div box which hovers on click or when you hover on a link:

see: http://jqueryfordesigners.com/coda-popup-bubbles/
(click on “try demo”)

for a person with problems doing this, see also:


The first thought is to use some form of BG image with a little triangle like a cartoon “talk box.” The hard part is getting the caret to point to the mouse position/calendar day.

Source : Link , Question Author : Joshua Carmody , Answer Author : Community

Leave a Comment