Released 7 years ago , Last update 7 years ago

mooCaption adds captions to images, with various effects, and any position. The Caption can fade in, slide it, or be always present.

What's mooCaption?

mooCaption is a library that will allow you to a caption to images in your website.

How to use it?

You'll need a few thing to use it. First of all the mootools Core library
the file is included in the download, along with the mooCaption file.
You need to include the 2 files in betweend the and of your html code. and don't forget the style sheet.
then just add to your domready event, the call to mooltiSelect, something like:

window.addEvent('domready', function(){  
var captions = new mooCaption({});  

Which Properties you can pass to mooltiSelect, and which are the default values?

This are the available options:

speedOver: 'short',  
speedOut: 'normal',  
mode: 'slide',            
classposition: 'caption',  
position: 'bottom',  
slideFrom: 'normal',  
images: 'capt',  
opacity: '0.7',  
transition: 'Quart.easeIn'  

speedOver speed of the mouseover effect # short' - 250ms # 'normal' - 500ms # 'long' - 1000ms, or any number od ms.
speedOut speed of the mouseout effect # short' - 250ms # 'normal' - 500ms # 'long' - 1000ms, or any number od ms.
mode 'fade', 'slide', 'on', 'random', if random selected, any of the other 3 effects will be applied..
classposition the name of the CSS class to apply to the caption box .
position position of the caption (top or bottom).
slideFrom 'left', 'right' or 'normal'. Defines the side from where the caption slides in, defaults to 'normal'.
images class of the images, if blank, all images in the page.
opacity set the final opacity of the caption. transition set the transition used by slide or fade modes, for more info about this, plese check Fx.Transitions.

is there any special markup I need to know?

Yes there is a requirement in the CSS, the caption must have position: relative and float: left, otherwise, won't work on Firefox AND Internet Explorer.

is it compatible with every browser?

I only tested it on firefox 3.6, and Internet explorer 8, it should work fine with Opera, and Safari (and any other Webkit browser), but I can't assure that.


14 day 14-day money-back guarantee


MIT license

The MIT license is an open-source license.

License » MIT license Download

Get A Quote

What do you need?
  • Custom development
  • Integration
  • Customization / Reskinning
  • Consultation
When do you need it?
  • Soon
  • Next week
  • Next month
  • Anytime

Thanks for getting in touch!

Your quote details have been received and we'll get back to you soon.

Or enter your name and Email
No comments have been posted yet.