A Simple jQuery Image Fade In/Fade Out With A Delay

InnerFade with JQuery

What is it?

InnerFade is a small plugin for the jQuery-JavaScript-Library. It's designed to fade you any element inside a container in and out.

These elements could be anything you want, e.g. images, list-items, divs. Simply produce your own slideshow for your portfolio or advertisings. Create a newsticker or do an animation.

The call

$('ID or class of the element containing the fading objects').innerfade({ animationtype: Type of animation 'fade' or 'slide' (Default: 'fade'), speed: Fadingspeed in milliseconds or keywords (slow, normal or fast)(Default: 'normal'), timeout: Time between the fades in milliseconds (Default: '2000'), type: Type of slideshow: 'sequence', 'random' or 'random_start' (Default: 'sequence'), containerheight: Height of the containing element in any css-height-value (Default: 'auto') runningclass: CSS-Class which the container get’s applied (Default: 'innerfade') });

Examples

A newsticker (with animationtype: 'slide')

• 5 Nec Lorem.
• 7 Leo orci pede.

• 1 Lorem ipsum dolor
• 2 Sit amet, consectetuer
• 3 Sdipiscing elit,
• 4 sed diam nonummy nibh euismod tincidunt ut
• 5 Nec Lorem.
• 6 Et eget.
• 7 Leo orci pede.
• 8 Ratio randorus wil.

A list with images and links

• 

• 
• 
• 
• 
• 

Elements with classes

10

X

1
2
3
4
5
6
7
8
9
10

A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z

Download

jquery.innerfade.zip (124kb)