jshine - jQuery effect plugin

The logic of action: the image "flies" over the div(or image) element from left to right. This is done at a certain frequency (in milliseconds) and with a certain duration. It can be used for multiple items at one time on one page.

Example of use:  

$ ('# myDiv'.) jshine ({'overElement': 'img87', 'effImgSrc': 'aa3.png'}); 

where:

myDiv - a layer effect, whose background is animated
overelement - an element that shows the animation
effImgSrc - url file that serves as an animation

Optional configuration parameters passed in function :
overElement ('myimg')
frequency (2000),
duration (1000)
easing ('linear')
effImgSrc ('aa4.png')
times (0)

Picture effect is not reproduced on the y-axis - the amount usually should be higher than the element.

Demo:


This is a demo paragraph with hover handler


How to use. Step by step: 

  • Add style to the target element (image or paragraph).
    position: absolute; z-index: 1;
  • After that, add an empty div element with the attribute 'id' set.
    <div id="myid"> </div>
  • Add a wrapper (div) to these two elements with height set to target height
  • Call function jshine (suggested place: event handler 'ready' document)

Image effect should be in png format because this format supports transparency. This image in a graphics program:


Project's download page: http://code.google.com/p/jshine/