jQuery Capty - A Caption Plugin (current version: 0.2.0)
jQuery Capty is a plugin jQuery Capty is a plugin that creates captions over the images.
With default options:
$('#default').capty();
<img id="default" src="image.jpg" alt="Super Mario Bros.®" width="342" height="262"/>
With animation and a custom speed:
$('#animation').capty({
animation: 'fade',
speed: 400
});
<img id="animation" src="image.jpg" alt="Super Mario Bros.®" width="342" height="262"/>
With fixed caption:
$('#fixed').capty({
animation: 'fixed'
});
<img id="fixed" src="image.jpg" alt="Super Mario Bros.®" width="342" height="262"/>
A custom caption with a external content:
Mario - Super Mario Bros.®
http://www.mariobros.com
$('#content').capty({
height: 46,
opacity: .6
});
<img id="content" src="image.jpg" name="#content-target" width="342" height="262"/>
<div id="content-target">
<span style="color: #F00;">Mario</span> - Super Mario Bros.®<br/>
<a href="javascript:void(0);">http://www.mariobros.com</a>
</div>
A group of elements with sufix, prefix and a custom style:
$('.fix').capty({
cWrapper: 'capty-tile',
prefix: '<span style="color: #35BB87">Luigui</span>',
sufix: 'Super Mario Bros.®'
});
<img src="image-1.jpg" class="fix" width="240" height="161"/>
<img src="image-2.jpg" class="fix" width="240" height="161"/>
<img src="image-3.jpg" class="fix" width="240" height="161"/>
Default options:
animation: 'slide'
The captions animation type: 'slide', 'fade' or 'fixed'.
cCaption: 'capty-caption'
The class name of the wrapper caption.
cImage: 'capty-image'
The class name of the wrapper image.
cWrapper: 'capty-wrapper'
The class name of the wrapper image and caption.
height: 30
The height of the caption.
opacity: .7
The opacity of the caption.
prefix: ''
The text/html that will be applied at the beginning of the legend.
speed: 200
The speed in which caption will appear and disappear.
sufix: ''
The text/html that will be applied at the end of the caption.