求大神來幫我解釋一下這段代碼?。?!
var?_al?=?[]; function?waterfall(){ ?????//?計算及定位數(shù)據(jù)塊顯示分散效果 ?????var?_pin?=?$("#main").find(".pin"); ?????var?_pw?=?_pin.eq(0).outerWidth(); ?????var?_wh?=?$(window).height()/2; ?????var?_ww?=?$(window).width(); ???????? ????var?_co?=?Math.floor(_ww/_pw); ????var?_pi?=?_pin.length; ????//?初始化數(shù)組 ????for(var?i?in?_pin){ ????????if(i<_co){ ????????????_al.push(0); ????????} ????????_pin.eq(i).css({ ????????????top:_wh, ????????????left:'50%', ????????????'margin-top':-(_pin.height()/2)+((Math.floor(Math.random()*10)<5?-1:1)*Math.floor(Math.random()*200)), ????????????'margin-left':-(_pin.width()/2)+((Math.floor(Math.random()*10)<5?-1:1)*Math.floor(Math.random()*200)) ????????}); ????} ????animateWater(_pin,0,_pw); } function?animateWater(_pin,_i,_pw){ ????????var?_t?=?getMin(_al); ????????_pin.eq(_i).animate({ ????????????left:_t*_pw, ????????????'margin':0, ????????????top:_al[_t] ????????},300,function(){ ????????????_al[_t]+=_pin.eq(_i).outerHeight(); ????????????_i++; ????????????animateWater(_pin,_i,_pw); ????????}) } function?getMin(_al){ ????var?_minT?=?Math.min.apply(null,_al); ????for(var?i?in?_al){ ????????if(_al[i]==_minT){ ????????????return?i; ????????} ????} }
'margin-top':-(_pin.height()/2)+((Math.floor(Math.random()*10)<5?-1:1)*Math.floor(Math.random()*200)),
?'margin-left':-(_pin.width()/2)+((Math.floor(Math.random()*10)<5?-1:1)*Math.floor(Math.random()*200))對于這兩行十分不解,
animateWater()會不會無限循環(huán),為什么?
2017-02-17
棒棒的
2016-04-10
試答我的理解,純當(dāng)交流:
分別生成隨機(jī)的margin-top和margin-left值,通過Math.random()方法組合生成隨機(jī)數(shù)值,如:
Math.random()*10)<5?-1:1--->生成10以內(nèi)的隨機(jī)數(shù),如小于5,則返回-1;如大于5,則返回1;
Math.random()*200--->生成200以內(nèi)的隨機(jī)數(shù)
結(jié)合起來((Math.floor(Math.random()*10)<5?-1:1)*Math.floor(Math.random()*200)),就是生成正負(fù)200以內(nèi)的隨機(jī)數(shù),其他的數(shù)值,前邊代碼都固定值了,對應(yīng)加上就是。
不會無限循環(huán),驗(yàn)證過了,至于為什么,我的理解是:
_pin.eq(_i).animate()其中.eq(_i)傳入的_i最終會超出_pin對象的索引范圍,此時應(yīng)該是構(gòu)造了一個空對象,空對象不能執(zhí)行.animate()方法吧(PS:個人理解,還待驗(yàn)證)