Ajax Updates

Light Window : Single Modal Window
Unobtrusive Loupe Magnifier
Unobtrusive PHP Ajax Star Rating
Accordion v2.0 Ajax Script

Posted: 05 Nov 2009 01:20 PM PST

Another implementation of single modal window. It uses iframes which is not so great.

After researching every single modal window, lightbox, slimbox, etc out there nothing fit the bill. Granted some of them were very nice but only fit a specific purpose, others were a nightmare on the code end, and others were just hacks of another. None of them truly supported all of the features we needed and those that were close could not be easily adapted without a bottle of Prozac near by.

Other caveats were the complete lack of ability to style and position the system, and the insane over-kill of some of the systems trying to reproduce either another desktop (As if most computer users aren't confused enough) or the reproduction of a popup window (Show me someone who likes popup windows…). Lastly, most people didn't actually test for their media types and how they behaved in other browsers and operating systems (Yes the movies and Flash work in Firefox for the Mac).

Demo: http://stickmanlabs.com/lightwindow/#demos
Download: http://www.ajaxlady.com/windows/306-light-window.html/attachment/lightwindow
Source: http://stickmanlabs.com/lightwindow/#demos

Related Listings:

Light Windows v2.0 Ajax Script After researching every single modal window, lightbox, slimbox, etc out...
DHTML Window/modal dialog script This script displays a modal message at the center of...
JQuery Modal Dialog Plugin This is a “yet another modal dialog JQuery plugin with...

Unobtrusive Loupe Magnifier

Posted: 05 Nov 2009 01:14 PM PST

Loupe Magnifier

You can use Loupe.js to add a loupe (magnifier) to images on your webpages.

loupe.js 1.3 allows you to add a loupe (magnifier) to images on your webpages. It uses unobtrusive javascript to keep your code clean. It uses unobtrusive javascript to keep your code clean.

It works in all the major browsers – Mozilla Firefox 1.5+, Opera 9+, Safari and IE6+. On older browsers, it'll degrade and your visitors won't notice a thing.

Demo: http://www.netzgesta.de/loupe/
Download: http://www.ajaxlady.com/image-effects/347-loupe-magnifier.html/attachment/loupe
Source: http://www.netzgesta.de/loupe/

Related Listings:

Filmed.js 1.21 Script on Pictures filmed.js 1.21 allows you to add film strip and shadow...
Unobtrusive Ajax Guestbook Unobtrusive AJAX Guestbook.XML is easy to use ajax and php...
Magnifier to images with CSS and Java A couple of people have asked about the CSS magnifier...

Unobtrusive PHP Ajax Star Rating

Posted: 05 Nov 2009 01:07 PM PST

This is a rating bar script done with PHP/mySQL/Ajax that allows users to rate things.
This is a rating bar script done with PHP and mySQL that allows users to rate things like can be done on Netflix or Amazon, all web 2.0-like with no page refresh.

It is a major improvement on the previous version because it is now unobtrusive, meaning that if Javascript is off it will still work (although the page will refresh). You can also set the number of rating units you want to use (i.e. 4 stars, 5 stars, or 10 stars) on a rater to rater basis (see samples below or read the docs). A few other changes were made as well – see the docs for details. Note that this script isn't tied to any specific system (such as WordPress), so you should be able to adapt it to your situation without too much trouble.

Download: http://www.ajaxlady.com/rating/352-multi-ajax-star-rating.html/attachment/ajaxstarrater_v122
Source: http://www.masugadesign.com/the-lab/scripts/unobtrusive-ajax-star-rating-bar/

Related Listings:

AJAX Star Rating Bar This is a rating bar script done with PHP and...
AJAX Rating Stars Demo AJAX Rating Stars Demo Installation Option. maxRating: integer. The maximum...
Simple Star Rating System Script Simple Star Rating System This is a jquery plugin for...

Accordion v2.0 Ajax Script

Posted: 05 Nov 2009 12:57 PM PST

Accordion V2.0 is built with scriptaculous ajax library. Accordion V2.0 is fast, lightweight and tested in all major browsers. In accordion V2.0 lots of bugs has been fixed.

Here are the couple of features for Accordion V2.0

* Open and close functionality
* Nested vertical accordions
* All accordions will automatically resized when contents added in real time manner
* Supports horizontal and vertical accordion

How to use accordion ajax script

You need to include accordion.js but it requires prototype.js and effects.js

 <script type="text/javascript" src="javascript/prototype.js"></script> <script type="text/javascript" src="javascript/effects.js"></script> <script type="text/javascript" src="javascript/accordion.js"></script>

The Markup

Pretty much anything will work, so its really up to you. The presentation is up to you (see the source of this page for some examples). Ideally you should probably use header tags with div's containing the content as this would be best symantically speaking and for seo. Below is a basic example.

 <h2 class="accordion_toggle">Title Bar</h2> <div class="accordion_content">...</div> ... ... ... <h2 class="accordion_toggle">Title Bar</h2> <div class="accordion_content">...</div>

The important thing here is that it need to be the title element then the content element and so on, nothing in between, just like every other accordion.

Demo:http://www.stickmanlabs.com/accordion/
Download:http://www.ajaxlady.com/downloads/accordionv20.zip
Source:http://www.stickmanlabs.com/accordion/