作者Tethys (花芯)
看板Ajax
標題[問題] 看不太懂的程式碼
時間Mon Sep 23 18:51:14 2013
這是一個可以把圖片切換左右滑動的原始碼
來源：
http://www.veryhuo.com/a/view/43357.html
$(function(){
var i=0;
//指定變數「i」的初始值為零
var li = $(".lxfscroll li");
//指定li是選擇html中class="lxfscroll"的li元素
var n=li.length-1;
//指定變數「n」等於li的數量-1 (假設li有六個就是五)
var speed = 300;
//指定速度為300
li.not(":first").css({left:"400px"});
// 如果不是li中的第一項，指定往右滑動400px
li.eq(n).css({left:"-400px"});
//針對在li中的「n」項(假設是5) 往左滑400px
//因為 .eq是從零開始，所以其實是指第六項
//所以滑到第六張圖的時候就往左滑400px
lxfNext=function (){
//指定一個功能"lxfNext"
if (!li.is(":animated")) {
//"如果li正在動畫中"是錯的即為true，就執行下面
(這裡的驚嘆號是表示not？)
if (i>=n){i=0;li.eq(n).animate({left:"-400px"},speed);
//如果「i」大於或等於「n」，執行{將「i」歸零，指定li中的第「n」項產生動畫
往右滑400px}
//然後後面{執行}的也就是指滑到第六張圖片就會往左滑400px，表示移到上一張圖片？
li.eq(i).animate({left:"0px"},speed);
//li中的第0項（就是第一張圖片）產生動畫：往最初位置移動
else{i++;li.eq(i-1).animate({left:"-400px"},speed);
//否則「i」累加數值；指定「i-1」之項目產生動畫：往左滑400px
//意指「i（零）會持續加一」直到大於或等於「n（五）」
//li中的第（i-1項，可能是1-1,2-1..）會產生動畫往左滑400px
//表示滑到第五張之前都是往左滑的
li.eq(i).animate({left:"0px"},speed);};
// li中的第「i」項（原本是零）產生動畫：返回原位
// 這裡不太懂>"< 「i」會是哪個值？
li.not("eq(i)").css({left:"400px"});
// li若不是第「i」值時執行動畫：往右滑400px
$("i").text(i+1);
}else{};
};
lxfLast=function (){
if (!li.is(":animated")) {
if (i<=0){i=n;li.eq(0).animate({left:"400px"},speed);
li.eq(n).animate({left:"0px"},speed);
}else{i--;li.eq(i+1).animate({left:"400px"},speed);
li.eq(i).animate({left:"0px"},speed);}
li.not("eq(i)").css({left:"-400px"});
$("i").text(i+1);
};
};
});
想請教大家我這樣的解釋對嗎？？
新手學習中，請多多指教，謝謝～～！！
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 202.39.237.142
1F：→ danny8376:其實這程式的效果有點怪OWO 09/23 20:00
2F：→ danny8376:等... 奇妙了 他的預覽正常 我複製的那份倒是效果不對 09/23 20:07
3F：→ danny8376:原來XDD 他用jQuery 1.4 我用1.9 所以出事了XDD 09/23 20:09