Ad switching effect (slow switching) _ ad code

An advertisement switching effect (click to view the DEMO) is a common form, but the function has been expanded to some extent. Main functions:

1. Automatic Detection of the number of AD images to produce ad Sequences
2. Slow switching, similar to the original FLASH effect
3. automatic playback Based on the set period
4. Move the mouse to stop automatic playback. Move the mouse to restore automatic playback.
The first feature is more practical, so there is no need to update the number of images and images separately.
The easing plug-in of jQuery is applied.

Paste the program code:

The Code is as follows:

$ (Document). ready (function (){
Var MyTime = false; // Timer
Var piclist = $ ("# piclist"); // picture list
Var num = piclist. find ("li"). length; // automatically checks the number of image advertisements
Var picnum = $ ("# picnum ");
Var index = 0; // start sequence
Var width = 388; // ad width
Var movetime = 600; // time used for a single Animation
Var speed = 3000; // switch Interval


// Mark the current
Function cur (ele ){
Ele = $ (ele )? $ (Ele): ele;
Ele. addClass ("cur"). siblings (). removeClass ("cur ");
}
Function int (){
Piclist.css ({"width": width * num + "px "});
Var nums = "";
For (I = 0; I If (I <9 ){
Nums + = "" + 0 + (I + 1) + "<\/span> ";
} Else {
Nums + = "" + (I + 1) + "<\/span> ";
}
}
Picnum.html (nums );
Cur (picnum. find ("span"). eq (index ));
}
// Initialization execution
Int ();

$ (Picnum. find ("span"). mouseover (function (){
Index = $ ("# picnum span"). index ($ (this) [0]);
// If (! Piclist. is (": animated ")){
Move ();
//}
})


Var move = function move (){
Piclist. animate ({"left":-width * index + "px"}, {queue: false, duration: movetime, easing: "easeOutQuart "});
Cur (picnum. find ("span"). eq (index ));
}

$ ('P. flsad '). hover (function (){
If (MyTime ){
ClearInterval (MyTime );
}
}, Function (){
MyTime = setInterval (function (){
Move ()
Index ++;
If (index = num) {index = 0 ;}
}, Speed );
});
// Start automatically
MyTime = setInterval (function (){
Move ();
Index ++;
If (index = num) {index = 0 ;}
}, Speed );
})

Online Demo
Package download