By: Horishilow Boris
Thank you for purchasing my item. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!
To use this plugin you must include two files from this plugin - hover_pack.js and hover_pack.css. Also you need to have jQuery plugin included in your code (You must include it before hover_pack.js file).
In example code you can find this code structure:
So, there is link tag, image tag and span tag (optional), that can include some text (text must be wrapped in header or paragraph tags).
The anchor tag must have two CSS classes -
b-animate-go and class with animation name (list of this classes you can find in hover animation section).
If you want to use some text that will go over hover tile, you must to add span tag with css class b-wrapper. After that you can add text in header and paragraph tags into this tag. Also if you want to use animation and delay effects for your text, you must to add CSS classes to header and paragraph tags. List of this classes you can find in text animation section below.
To add hover effects, you can use css classes, listed below:
Also you can add opacity to hover layout by adding listed below classes (this will work with all effects, except twist and flip):
b-opacity-10 - equals css property
b-opacity-20 - equals css property
b-opacity-30 - equals css property
b-opacity-40 - equals css property
b-opacity-50 - equals css property
b-opacity-60 - equals css property
b-opacity-70 - equals css property
b-opacity-80 - equals css property
b-opacity-90 - equals css property
For text animation you may use css classes, listed below:
b-cw-90 - clockwise rotation for 90 degrees
b-cw-180 - clockwise rotation for 180 degrees
b-ccw-90 - counterclockwise rotation for 90 degrees
b-ccw-180 - counterclockwise rotation for 180 degrees
Also you can add delay for each element by adding css classes, listed below:
b-delay03 - delay for 0,3 seconds
b-delay06 - delay for 0,6 seconds
b-delay09 - delay for 0,9 seconds
b-delay12 - delay for 1,2 seconds
b-delay15 - delay for 1,5 seconds
In this example text will be slide from left with delay 0,3 seconds.
Also you can use several effects for one element: