jQuery Plugin For Image Copyright Tooltip - imgrights
File Size: | 7.04 KB |
---|---|
Views Total: | 995 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
imgrights is a simple jQuery plugin that displays the linkable image copyright information when hovers over, based on Html5 data-*
attributes or inline elements.
How to use it:
1. Add the copyright information to an image using Html5 data-copyright
and data-copyright-url
attributes.
<img src="1.jpg" data-copyright="Copyright" data-copyright-url="https://www.jqueryscript.net">
2. Or using Html inline elements.
<div class="hmedia"> <img class="photo" alt="Copyright" src="1.jpg" /> <div style="display: none;"><em>by <span class="contributor vcard"> <a class="url fn" href="https://www.jqueryscript.net">Copyright</a> </span></em></div> </div>
3. Include the jQuery javascript library and jQuery imgrights plugin at the end of the document.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="jquery.imgrights.min.js"></script>
4. Call the plugin.
<script> $(function(){ $('img, .hmedia').imgrights(); }); </script>
5. Available options.
<script> $(function(){ $('img, .hmedia').imgrights(); }); </script>
This awesome jQuery plugin is developed by jeka-kiselyov. For more Advanced Usages, please check the demo page or visit the official website.