Question

求大神帮忙注释一段js代码，谢谢了，越详细越好！！！

$(document).ready(function(){

$('.select_btn li:first').css('border','none');
if ($('.zSlider').length) {
zSlider();
$('.h_sns').find('img').hover(function(){
$(this).fadeTo(200,0.5);
}, function(){
$(this).fadeTo(100,1);
});
}
function zSlider(ID, delay){
var ID=ID?ID:'.zSlider';
var delay=delay?delay:3000;
var currentEQ=0, picnum=$('.picshow_img li').size(), autoScrollFUN;
$('.select_btn li').eq(currentEQ).addClass('current');
$('.picshow_img li').eq(currentEQ).show();
$('.picshow_tx li').eq(currentEQ).show();
autoScrollFUN=setTimeout(autoScroll, delay);
function autoScroll(){
clearTimeout(autoScrollFUN);
currentEQ++;
if (currentEQ>picnum-1) currentEQ=0;
$('.select_btn li').removeClass('current');
$('.picshow_img li').hide();
$('.picshow_tx li').hide().eq(currentEQ).slideDown(400);
$('.select_btn li').eq(currentEQ).addClass('current');
$('.picshow_img li').eq(currentEQ).show();
autoScrollFUN = setTimeout(autoScroll, delay);
}
$('.picshow').hover(function(){
clearTimeout(autoScrollFUN);
}, function(){
autoScrollFUN = setTimeout(autoScroll, delay);
});
$('.select_btn li').hover(function(){
var picEQ=$('.select_btn li').index($(this));
if (picEQ==currentEQ) return false;
currentEQ = picEQ;
$('.select_btn li').removeClass('current');
$('.picshow_img li').hide();
$('.picshow_tx li').hide().eq(currentEQ).slideDown(100);
$('.select_btn li').eq(currentEQ).addClass('current');
$('.picshow_img li').eq(currentEQ).show();
return false;
});
};
});

Answer 1

/*jQuery 入口:当文档加载完成后执行的代码*/
$(document).ready(function(){
$('.select_btn li:first').css('border','none');//.select_ben 的第一个子元素去掉边框
if ($('.zSlider').length) {//如果.zSlider有长度
zSlider();//调用zSlider()函数
$('.h_sns').find('img').hover(function(){//在.h_sns中查找子元素img标签
$(this).fadeTo(200,0.5);//当期鼠标经过时,它自己淡入淡出效果
}, function(){
$(this).fadeTo(100,1);//当期鼠标移出时,它自己淡入淡出效果
});
}
function zSlider(ID, delay){
var ID=ID?ID:'.zSlider';//三元运算符就不用解释了吧?
var delay=delay?delay:3000;
var currentEQ=0, picnum=$('.picshow_img li').size(), autoScrollFUN;
$('.select_btn li').eq(currentEQ).addClass('current');//.select_btn下的第currentEQ个li元素添加current样式
$('.picshow_img li').eq(currentEQ).show();//.picshow_img 下的第currentEQ个li元素显示
$('.picshow_tx li').eq(currentEQ).show();//.picshow_tx 下的第currentEQ个li元素显示
autoScrollFUN=setTimeout(autoScroll, delay);//在延迟 delay毫秒后 调用autoScroll() 只执行一次
function autoScroll(){
clearTimeout(autoScrollFUN);
currentEQ++;
if (currentEQ>picnum-1) currentEQ=0;
$('.select_btn li').removeClass('current');//.select_btn下的第currentEQ个li元素 移除样式 current
$('.picshow_img li').hide();//.picshow_img 下的第currentEQ个li元素 隐藏
$('.picshow_tx li').hide().eq(currentEQ).slideDown(400);//.picshow_tx 下的第currentEQ个li元素显示其他隐藏
$('.select_btn li').eq(currentEQ).addClass('current');
$('.picshow_img li').eq(currentEQ).show();
autoScrollFUN = setTimeout(autoScroll, delay);
}
$('.picshow').hover(function(){
clearTimeout(autoScrollFUN);//当数鼠标经过.picshow时 清除时间
}, function(){
autoScrollFUN = setTimeout(autoScroll, delay);//当数鼠标移除.picshow时 直线一次调用autoScroll
});
$('.select_btn li').hover(function(){
var picEQ=$('.select_btn li').index($(this));
if (picEQ==currentEQ) return false;
currentEQ = picEQ;
$('.select_btn li').removeClass('current');
$('.picshow_img li').hide();
$('.picshow_tx li').hide().eq(currentEQ).slideDown(100);
$('.select_btn li').eq(currentEQ).addClass('current');
$('.picshow_img li').eq(currentEQ).show();
return false;
});
};
});