Author: | bolatovumar |
---|---|
Views Total: | 713 views |
Official Page: | Go to website |
Last Update: | August 13, 2015 |
License: | MIT |
Preview:

Description:
Captionify is a standalone JavaScript library to easily and semantically add captions to images.
Basic usage:
Load the Captionify’s CSS and JavaScript in the html page.
<script src="captionify.js"></script> <link rel="stylesheet" href="captionify.css">
By default, the Captionify will generate image captions from img’s src
attribute. You can also add custom captions and links to your images using HTML5 data-* attributes.
<img data-caption="Image Caption" data-link="https://cssscript.com" src="demo.jpg" alt="Image Alt" >
Generate an image caption bar over the image.
captionify({dataCaption: true});
Default options.
// pass in a tag (like article), a class ( like .content) or id (like #images) containerSelector: "body", // set to true if you would like to use a 'data-caption' attribute for captions instead of the default 'alt' attribute dataCaption: false, // default class for the <figure> tag figureClass: "imgFigure", // default class for the <figcaption> tag figcaptionClass: "imgFigure__caption", // pass in a class name of images which you would like to caption imgClassSelector: "", // <figure> tag will inherit any direct styling (i.e., inline CSS) of its contained <img>. // Set to false to disable this behaviour inheritStyles: true, // overlay | bottom mode: "overlay", // sets the container width to the image width if it contains an explicit width attribute. Set to false to disable this behaviour setFigureWidth: true