程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 更多編程語言 >> 編程綜合問答 >> jquery-這段代碼的詳細解析(初學者,看的暈暈的)謝謝

jquery-這段代碼的詳細解析(初學者,看的暈暈的)謝謝

編輯:編程綜合問答
這段代碼的詳細解析(初學者,看的暈暈的)謝謝

/**
 **公用滾動方法
 **     支持定時自動輪播、前後輪播、單獨點擊輪播
 **/
(function($){
 
$("div[data-scro='controler'] b,div[data-scro='controler2'] a").click(function(){
 
var T = $(this);
if(T.attr("class")=="down") return false;
J2ROLLING_ANIMATION.st({
 
findObject : T,//當前點擊對象 默認寫
main : T.parent().parent().find("div[data-scro='list']"),//滾動目標容器窗口對象
pagSource : T.parent().parent().find("div[data-scro='controler'] b"),//切換按鈕對象
className : "down",//選中的樣式
duration : "slow",//滾動速度 和jquery速度一致
on : $(this)[0].tagName=="A" ? true : false//用於判斷是否開啟無限滾動 or 來回切換
 
});
return false;
 
});
var J2SETTIME="", J2Time=true,J2ROLLING_ANIMATION = {
 
init : function(){
 
this.start();
this.time();
 
},
st : function(o){
 
if(J2Time){
 
this.animate(o.findObject,o.main,o.className,o.duration,o.pagSource,o.on);
J2Time = false;
 
}
 
},
animate : function(T,M,C,S,P,O){
 
var _prevDown = O ? P.parent().find("*[class='"+C+"']") : T.parent().find(T[0].tagName+"[class='"+C+"']"),
_prevIndex = _prevDown.index(),
_thisIndex = O ? (T.attr("class")=="next" ? _prevIndex+1 : _prevIndex-1) : T.index(),
_list = M.find(".item"),
p2n = 1;
_prevDown.removeClass(C);
if(O){
 
if(_thisIndex==-1) _thisIndex=_list.size()-1;
if(_thisIndex==_list.size()) _thisIndex=0;
P.eq(_thisIndex).addClass(C);
 
}else{
 
T.addClass(C);
 
}
if(T.attr("class")=="prev" || _thisIndex<_prevIndex) p2n = false;
if((T.attr("class")=="next" || _thisIndex>_prevIndex)&&T.attr("class")!="prev") p2n = true;
 
!p2n ? _list.eq(_thisIndex).css("left",-M.width()) : '';
_list.eq(_prevIndex).animate({
left:p2n ? -M.width() : M.width()
},S,function(){
 
$(this).removeAttr("style");
J2Time = true;
 
});
_list.eq(_thisIndex).animate({
left:"0px"
},S);
 
},
start : function(){
 
$("#section-focus-pic div[data-scro='controler'] b,#section-focus-pic div[data-scro='controler2'] a").mouseover(function(){
 
window.clearInterval(J2SETTIME);  
 
}).mouseout(function(){
 
J2ROLLING_ANIMATION.time();
 
});
 
},
time : function(){
 
J2SETTIME = window.setInterval(function(){
 
var num = $("#section-focus-pic div[data-scro='controler'] b[class='down']").index(),
_list = $("#section-focus-pic div[data-scro='list'] li");
_list.eq(num).animate({
"left":-$("#section-focus-pic div[data-scro='list']").width()
},"slow",function(){
 
$(this).removeAttr("style");
$("#section-focus-pic div[data-scro='controler'] b").removeClass("down").eq(num).addClass("down");
 
});
num++;
if(num==_list.size()){
 
num=0;
 
}
_list.eq(num).animate({
"left":"0px"
},"slow");
 
},4000);
 
}
 
};
$("a").click(function(){
 
$(this).blur(); 
 
});
 
J2ROLLING_ANIMATION.init();//是否開啟自動輪播
 
})(this.jQuery || this.baidu);

最佳回答:


寫的好復雜,看不懂,是要做輪播圖嗎?有很多方法:http://blog.csdn.net/qq_19558705/article/details/49851879

xiaoguaishou21509
xiaoguaishou21509
qq_19558705
xiaoguaishou21509
  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved