ocrim1996 / image-caption

Polymer component for displaying images with caption. Due to changes in browser support for web components and changes in Polymer since this was created, it probably does not work anymore.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

<image-caption>

Adds image alt text as a caption for the image

Demo

Check it live!

Install

Install the component using Bower:

$ bower install image-caption --save

Or download as ZIP.

Usage

  1. Import Web Components' polyfill:

    <script src="bower_components/platform/platform.js"></script>
  2. Import Custom Element:

    <link rel="import" href="bower_components/image-caption/dist/image-caption.html">
  3. Start using it!

    <image-caption src="/foo.png" alt="useful alt for the foo image"></image-caption>

Options

Attribute Options Default Description
src string blank the source file for the image
alt string blank the alt attribute for the image

Development

In order to run it locally you'll need to fetch some dependencies and a basic server setup.

  • Install Bower & Grunt:

    $ [sudo] npm install -g bower grunt-cli
  • Install local dependencies:

    $ bower install && npm install
  • To test your project, start the development server and open http://localhost:8000.

    $ grunt server
  • To build the distribution files before releasing a new version.

    $ grunt build
  • To provide a live demo, send everything to gh-pages branch.

    $ grunt deploy

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -m 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

History

For detailed changelog, check Releases.

License

MIT License

About

Polymer component for displaying images with caption. Due to changes in browser support for web components and changes in Polymer since this was created, it probably does not work anymore.


Languages

Language:JavaScript 100.0%