<pedrocorreia.net ⁄>
 

<jQuery.UI Messenger, Outlook like message notification Widget ⁄ >




clicks: 4739 4739 2008-07-17 2008-07-17 goto programacao myNews programacao  Bookmark This Bookmark This


Today, Matt posted a cool progressbar widget using jQuery.UI. He gave a good introduction and explanation about how to build a widget using jQuery.UI.

Here, I'm following his sample to build my own one, which is MessengerOutlook like message notification [view demo]. So for reference and how to build one please return to jQuery.UI ProgressBar Widget by Matt Berseth.

Messenger like message notification widget is something I wished to do long time ago, and was lazy to think and code it, because I thought it would take to much coding. And I read Bilal's article How to Show Messenger-Like Popups Using AJAX but it wasn't a reusable component. So I just used his styles for demonstration.

After going through Matt's post, I decided to build it up right away. So Let's dive into the code. Below is the init method for the widget, I just initialize some local variables with to store current bottom position and height of the popup message element.



este é só um excerto do artigo, para aceder ao artigo completo, clique no link em baixo:
this is just a small excerpt from the article, to access the full article please click in the link below:

http://mosesofegypt.net/post/2008/07/17/jQueryui-Messenger-Outlook-lik...




Subscribe News RSS  Subscribe News Updates by E-mail





myNews <myNews show="rand" cat="programacao" ⁄>

RouterJs: easy routing for your ajax Web applications new ...

RouterJs is a simple router for your ajax web apps. It's build upon History.js which means that Rout (...)

clicks: 16342 16342 2012-05-14 2012-05-14 goto url (new window) haithembelhaj.g... goto myNews programacao


Backbone computed properties new ...

This gist shows one way to implement read- and write-enabled computed properties on a Backbone Model (...)

clicks: 16152 16152 2012-05-13 2012-05-13 goto url (new window) https://gist.gi... goto myNews programacao


Create Instagram Filters With PHP new ...

In this tutorial, I'll demonstrate how to create vintage (just like Instagram does) photos with PHP (...)

clicks: 15854 15854 2012-05-12 2012-05-12 goto url (new window) net.tutsplus.co... goto myNews programacao


HTML5 jQuery Paint Plugin new ...

Websanova Paint is a HTML5 canvas based jQuery plugin. It allows you to free paint on a canvas area (...)

clicks: 26936 26936 2012-05-12 2012-05-12 goto url (new window) websanova.com/t... goto myNews programacao


Android Query new ...

Android-Query (AQuery) is a light-weight library for doing asynchronous tasks and manipulating UI el (...)

clicks: 16386 16386 2012-05-12 2012-05-12 goto url (new window) code.google.com... goto myNews programacao


Sass vs. LESS vs. Stylus: Preprocessor Shootout new ...

CSS3 preprocessors are languages written for the sole purpose of adding cool, inventive features to (...)

clicks: 15561 15561 2012-05-11 2012-05-11 goto url (new window) net.tutsplus.co... goto myNews programacao


Real-time Applications With Node.js and Socket.IO new ...

Hey everyone! Sorry about the long pause since the last blog post, life has been quite hectic for th (...)

clicks: 16227 16227 2012-05-11 2012-05-11 goto url (new window) codingcookies.c... goto myNews programacao


Gettings to know Backbone.ks new ...

In this series, we're going to learn how to build a fully functional contacts manager using Backbone (...)

clicks: 15145 15145 2012-05-10 2012-05-10 goto url (new window) net.tutsplus.co... goto myNews programacao