About
This module will make add a caption along with a hover effect with a custom template using jQuery and Angular.
Image
Hover on the element to see the result
When you hover on this, you see me
Paragraph
{{dummyText}}
When you hover this element, you see me
List
When you hover on this, you see me. I'm {{$index+1}}
Get Started
Get the package:
bower install ng-caption-hover
Add the script tags:
<link rel="stylesheet" type="text/css" href="dist/ng-caption-hover.min.css" media="screen"> <script src="bower_components/jquery/dist/jquery.min.js"></script> <script src="bower_components/angular/angular.min.js"></script> <script src="dist/ng-caption-hover.min.js"></script>
Then add the module to your app:
angular.module('yourApp', ['ng-caption-hover']);
Usage
<div ng-caption-hover-root> <div ng-caption-hover-content> We put the visible content into here. When user hovers on this area, the caption would show. </div> <div ng-caption-hover-caption> We put the body of the hover caption into here. </div> </div>