StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I might be a bit late with this answer, but if anybody comes here looking for a client-side plugin relevant to this kind of use-case, I've made an open source jQuery notification system that can be integrated seamlessly with web apps, called <a href="http://vickychijwani.github.com/jquery-notify-osd/" rel="nofollow">jNotifyOSD</a>. You can see a demo on that link. The code's up <a href="http://github.com/vickychijwani/jquery-notify-osd/" rel="nofollow">on GitHub</a>. I've tried to keep the API clean and dead simple to use. Here's an example:</p> <pre><code>$.notify_osd.create({ 'text' : 'Hi!', // notification message 'icon' : 'images/icon.png', // icon path, 48x48 'sticky' : false, // if true, timeout is ignored 'timeout' : 6, // disappears after 6 seconds 'dismissable' : true // can be dismissed manually }); </code></pre> <p>You can even set global defaults for all future notifications (can be overridden on a per-notification basis):</p> <pre><code>$.notify_osd.setup({ 'icon' : 'images/default.png', 'sticky' : false, 'timeout' : 8 }); </code></pre> <p><strong>UPDATE [13th Dec, 2012]</strong>:</p> <p>It's been some time, but I've finally implemented support for multiple visible notifications using a queue system. So for example:</p> <pre><code>$.notify_osd.setup({ // ... config ... 'visible_max' : 5 // max 5 notifications visible simultaneously 'spacing' : 30 // spacing between consecutive notifications }); </code></pre> <p>You can see a demo <a href="http://vickychijwani.github.com/jquery-notify-osd/" rel="nofollow">here</a>. I think the plugin is now flexible enough to cover a wide variety of use-cases.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload