ReMooz (v1.0)

Project ReMooz Showcase ReMooz is an open-source widget for great looking and unobtrusive inline-pop-ups, powered by MooTools. It enables how your vistors browse through content, such as thumbnail images and HTML. ReMooz features centered or relative-positioned draggable zoomed images, content preloading, fading captions, with plenty of options and is highly configurable: Add a simple image zoom or create a fancy design element for any graphic that needs to be enlarged on your site.


Showcases

  • Flickr Bigger ReMooz for previews on flickr photostream thumbnails, large size.
  • Flickr Stream ReMooz for previews on flickr photostream thumbnails, medium size.
  • Simple Caption ReMooz on a Flickr Photostream with captions.

Features

  • No plugins like Flash or Java needed, no problem with popup blockers
  • Unobtrusive behaviour, visitors with disabled JavaScript or old browsers can still click the images to see the full size.
  • Simple and intuitive behaviour: loading-indicator, close button and changing icons describe possible interactions.
  • No obstrusive modal pop-up: your design and content is still visible (not hidden under the common black lightbox effect).
  • Open several instances at one time, e.g. to preview multiple images.

How to use

// Wait for the content ...
 
window.addEvent('domready', {
 
    /**
     * Assigns ReMooz behavior to all anchors with the .remooz class
     */
    ReMooz.assign();
 
    /**
     * Or assign ReMooz "by hand"
     */
    $$('ul.thumbnails a').each(function(element) {
 
        // Constructor, takes the element and options as arguments
        new ReMooz(element, {
            centered: true, // Zoom the center of the screen
            origin: element.getElement('img') // Take the image inside as origin for the zooming element
        });
 
    });
 
});

Compatibility

Fully compatible with all A-Grade Browsers (Internet Explorer 6+, Opera 9, Firefox 1.5+ and Safari 2+)

Planned

  • Support for elements, expandable content handler (via plugins)
  • Gallery support including navigation

Sites using it

Requirements

MooTools JavaScript Framework

Download MooTools 1.2 with at least these modules:

  • Element.Dimensions
  • Fx.Tween
  • Fx.Morph
  • Selectors
  • DomReady (facultative)

Download

Changelog

1.0.4 (2008-04-22)
  • Changed: Removed orphaned code like trash event
  • Fixed: Added missing image links for Download
1.0.3 (2008-04-17)
  • Fixed Dragging for IE
1.0.2 (2008-03-28)
  • Initial official beta release
  • Project page and download
  • Shadows for WebKit via CSS
1.0.1 (2008-01-16)
  • Stable API
  • More options and customizations
  • Support for captions from title
  • IE optimizations for shadow and PNGs
1.0 (2007-11-02)
  • Initial working version for MooTools 1.2

License

All files are © 2008-2009 by Harald Kirschner and available under the MIT License.

Contact & Discussion

For asking questions, requesting features, filing bugs or contributing other thoughts on this project use the support forum below. Before posting a new question, read through the documentation and the contributed notes for an answer. For problem reports make sure to add enough details like browser, version and a link or the relevant code.

You can contact me for non-support related notes.

Professional Support

I am available for hire if you look for professional and swift help. I can come to your rescue for installation, customization or extending the existing source for your needs.

Share it: Stumble it!Digg This!del.icio.us (82 Posts: )

discussion by DISQUS No Comments

Please use the support forums for discussing the project, asking questions or posting bug-fixes!

Sort:
No Comments
  • First
  • ‹ Prev
  • Next ›
  • Last
No Comments
  • First
  • ‹ Prev
  • Next ›
  • Last

Post your comment

Please use the support forums for discussing the project, asking questions or posting bug-fixes!


Internet Consultant & Contractor

I'm available to combine forces with you and your team to find the most simple, elegant and convenient web solutions . I await your call.

If you just like my work and want to say Thank You, donate via PayPal or Amazon Wish List.

Developer Resources & Tools