Fade in and out slideshow plug-in with automatic switching based on jQuery_jquery

$(function(){
//SAMPLE-A call---no parameters are passed in, the default parameters are called
$('div#slide').iFadeSlide();
//SAMPLE-B call---Passing in new parameters will overwrite the original parameters. If not passed in, the default value will be used
$('div#slide_b').iFadeSlide({
field: $ ('div#slide_b a'),
icocon:$('div.ico_b'),
hoverCls: 'high_b',
curIndex: 2, //The index value starts from 0, so it is set here Highlight the 3rd item
interval: 2000
});
//SAMPLE-C call---passing in new parameters will overwrite the original parameters, and the default value will be used if not passed in
$('div#slide_c').iFadeSlide({
field: $('div#slide_c img'),
icocon: $('div.ico_c'),
outTime:100,
inTime: 200
});
});

;(function($){
$.fn.extend({
iFadeSlide: function(options){
//Plug-in parameter initialization
var iset={
field:$('div#slide img'), //Switch element collection
icocon:$('div.ico'), //Index container
hoverCls:'high', //Switch to current Index highlighting style
curIndex:0, //Default highlighted index value, starting from 0
outTime:200, //Element fade-out time (ms)
inTime:300, //Element fade-in time (ms)
interval:3000 //Element switching interval (ms)
};
options=options || {};
$.extend(iset,options) ; //Merge parameter objects. If there is a new value in options, overwrite the corresponding value in iset, otherwise use the default value.
//Generate a corresponding index value list based on the amount of switching elements and insert it into the switching area
var ulcon = "

";
iset.field.each(function(i){
ulcon = ulcon '
• ' (i 1) '
';
});
ulcon = '

';
iset.icocon.append(ulcon);

var ico = iset.icocon.find('li'); / /Index list collection
var size = iset.field.size(); //Switch element amount
var index = 0; //Initial index value
var clearFun=null;
//Fade out Fade-in function
var fadeFun = function(obj){
index = ico.index(obj); //Get the current index value
//Fade out the currently visible element and find the element to fade in through the index value
iset.field.filter(':visible').fadeOut(iset.outTime, function(){
iset.field.eq(index).fadeIn(iset.inTime);
});
//Add a highlighting style to the current index and remove the highlighting style in sibling elements
$(obj).addClass(iset.hoverCls).siblings().removeClass(iset.hoverCls);
};
//Switch function
var changeFun = function(){
index; //Cumulative index value
if (index == size){index = 0}; //When When the index value is equal to the amount of switched elements, it is initialized to 0
ico.eq(index).trigger('mouseleave'); //Simulate the mouse out element area event for the current index
};
/ /Automatic switching function
var scrollFun = function(){
clearFun = setInterval(function(){
changeFun()
}, iset.interval);
};
/ /Stop automatic switching function
var stopFun = function(){
clearInterval(clearFun);
};

scrollFun(); //Initial automatic switching

/ /Swipe the mouse in the index area to stop automatic switching and switch the element to the current index. Move the mouse out to initialize the index to the current value (otherwise, the switching will be chaotic when the mouse is drawn out)
ico.hover(function(){
stopFun() ;
fadeFun(this);
}, function(){
fadeFun(this);
}).eq(iset.curIndex).mouseleave(); //Initially highlighted Index value

//Switching area stops automatic switching when the mouse is moved in, and continues automatically when drawn out
iset.field.hover(function(){
stopFun();
}, function( ){
scrollFun();
});
}
});
})(jQuery);