書(shū)不知道現(xiàn)在有沒(méi)有，不過(guò)網(wǎng)上有一些源碼分析的文章，給你推薦一個(gè)：
http://www.cnblogs.com/nuysoft/archive/2011/11/14/2248023.html

要不要閱讀別人代碼？
要。
閱讀別人代碼干什么？
提高自己的代碼質(zhì)量。
試圖通過(guò)閱內(nèi)讀別人代碼找容出代碼的邏輯？
錯(cuò)誤。
試圖通過(guò)閱讀別人代碼找出想要實(shí)現(xiàn)自己的邏輯的代碼？
正確，只有遵循了這個(gè)原則，才能實(shí)現(xiàn)物為我所用。
毫無(wú)目的去看別人代碼 不暈才怪呢。

建議去找原碼看，一般網(wǎng)上下載下來(lái)都是經(jīng)過(guò)壓縮的。

沒(méi)有API嗎？如果這個(gè)你都不看 不知道你看什么...
去找你版本的API下載 不懂得去看

var durl = $("#cplb ul").attr("data-url");獲取div下面的ul元素中的data-url并賦值給drul；

$("#cplb ul li").each(function(){
var url = $(this).find("a").attr("href");
if(url==durl){
$("#cplb ul li").removeClass("current");
$(this).addClass("current");
}
});
然后是遍歷出當(dāng)前有多少回個(gè)li元素；

創(chuàng)建 變量（答url）= 當(dāng)前l(fā)i元素找到下面的a標(biāo)簽并改變它的href值；
判斷：
如果當(dāng)前a元素的href值=ul的地址；
那么鼠標(biāo)移動(dòng)上去吧所有的Li元素中包含current類名的名字刪掉；
并給當(dāng)前的li元素添加current類名；

這個(gè)方法也就是經(jīng)常用在導(dǎo)航模塊中，current的屬性可以在css中設(shè)置，可以移動(dòng)上去為背景圖片，顏色都可以，添加其他css3效果也行

var durl = $("#cplb ul").attr("data-url");獲取div下面的ul元素中的data-url并賦值給drul；

$("#cplb ul li").each(function(){
var url = $(this).find("a").attr("href");
if(url==durl){
$("#cplb ul li").removeClass("current");
$(this).addClass("current");
}
});
然后是遍歷出當(dāng)前有多少個(gè)li元素；

創(chuàng)建 變量（url）= 當(dāng)前l(fā)i元素找到下面的a標(biāo)簽并改變它的href值；
判斷：
如果當(dāng)前a元素的href值=ul的地址；
那么鼠標(biāo)移動(dòng)上去吧所有的Li元素中包含current類名的名字刪掉；
并給當(dāng)前的li元素添加current類名；

這個(gè)方法也就是經(jīng)常用在導(dǎo)航模塊中，current的屬性可以在css中設(shè)置，可以移動(dòng)上去為背景圖片，顏色都可以，添加其他css3效果也行

這好像是計(jì)算數(shù)學(xué)的公式

#1， $('<img />')的意思是來(lái)創(chuàng)建一個(gè)<img />元素，源$('img')的意思是選擇img標(biāo)簽
#2，因?yàn)樗鼘?duì)每個(gè)圖片執(zhí)行了兩次load，每次Load執(zhí)行了一次++loaded，所以雙倍
#3，請(qǐng)注意開(kāi)頭的var $this = $(this)，所以此處是將該img的src賦值給$('<img />')的src
#4，load第二個(gè)圖片

從代碼效果分析，這個(gè)網(wǎng)站首次加載了預(yù)覽圖，然后它對(duì)每個(gè)圖片遍歷，然后修改其src達(dá)到加載其他該圖片相關(guān)的其他尺寸圖片的目的，這樣訪問(wèn)者點(diǎn)擊查看大圖的時(shí)候就不用再次等待圖片下載了

1. 使用來(lái)img將會(huì)全部默認(rèn)第自一個(gè)。
2. 我感覺(jué)不用乘以2啊，不知道這是為什么。
3. 這些是加載進(jìn)來(lái)的，即便是開(kāi)始時(shí)有默認(rèn)的，但來(lái)后還是要重新賦值。
4. 這兩個(gè)load有不同，明顯下面的attr執(zhí)行的操作就不同。
希望可以幫到你，不過(guò)何必去研究這種寫(xiě)到吐血的插件呢。

本人javascript半桶水,高手勿噴...但歡迎指正....
我從這段代碼的調(diào)用順序說(shuō)起吧
=====================
首先起作用的是
jQuery(function($) {
ph$.init();
});
意思就是從網(wǎng)頁(yè)準(zhǔn)備好之后,調(diào)用ph$對(duì)象的init()方法;
先看ph$是何物
ph$ = {};
ph$是json對(duì)象,json對(duì)象有屬性或方法,調(diào)用方法是json.屬性或json.方法()
==========================
然后去看看ph$.init()方法
init : function() {
this.bindEvt();
}
除了this,其他沒(méi)什么好說(shuō)的
如果想要在一個(gè)function內(nèi)使用this指向非window對(duì)象,通常需要實(shí)例化一個(gè)function,例如 a = new a();醬紫在a這個(gè)對(duì)象內(nèi),this指向a本身.
但是現(xiàn)在this是在json對(duì)象內(nèi),是指向json對(duì)象本身:即ph$,也就是說(shuō)ph$已經(jīng)是實(shí)例化的了
至于兩種實(shí)例化方法,最明顯的區(qū)別就是a()這個(gè)function可以實(shí)例化多個(gè)獨(dú)立對(duì)象,例如a = new a();b = new b();而json對(duì)象只能由a = {}這樣來(lái)實(shí)例化,是不能復(fù)用的.
======================
所以 this.bindEvt(); 是調(diào)用 ph$.bindEvt();
去看看bindEvt();
bindEvt : function() {
var o = {};
o.btn_sell_l = $("#pageLeft");
if (o.btn_sell_l.length > 0) {
o.btn_sell_l.bind("click", function() {
ph$.scrollLveSell('right');
});
}
o.btn_sell_r = $("#pageRight");
if (o.btn_sell_r.length > 0) {
o.btn_sell_r.bind("click", function() {
ph$.scrollLveSell('left');
});
}
}
o為json對(duì)象
o.btn_sell_l = $("#pageLeft");
把o的屬性 btn_sell_l 賦值為$('#pageLeft')這個(gè)jquery選擇器返回的數(shù)組,選擇的是網(wǎng)頁(yè)中id為pageLeft的元素

if (o.btn_sell_l.length > 0) {
o.btn_sell_l.bind("click", function() {
ph$.scrollLveSell('right');
});
}
o.btn_sell_l.length > 0 等于 $("#pageLeft").length > 0
jquery找不到id為pageLeft不會(huì)返回false,所以使用length判斷有沒(méi)有找到元素,大于零就是找到了

o.btn_sell_l.bind("click", function() {
ph$.scrollLveSell('right');
});
綁定click事件到o.btn_sell_l這個(gè)對(duì)象,事件內(nèi)容為調(diào)用Ph$的scrollLveSell方法,傳參right
下面的 o.btn_sell_r 等一段的代碼與以上的功能差不多,這里不作復(fù)述
下面看Ph$的scrollLveSell方法
臥槽,好長(zhǎng),請(qǐng)聽(tīng)下回分解....