第一，效果图
二、HTML代码
复制代码代码如下所示：

容器，容器*余量：0；填充：0；}

容器。{宽度：408px；身高：168px；溢出：隐藏；位置：相对；}

滑块{位置：绝对；}
滑块列表样式：无；显示：内联；}
img {。滑块宽度：408px；身高：168px；显示：块；}

。slider2 {宽度：2000px；}
。slider2李{浮动：左；}

。民{位置：绝对的；右：5px；底：5px；}
数字李{
浮点数：左；
颜色：# ff7300；
文本对齐：中心；
行高：16px；
宽度：16px；
身高：16px；
字体家庭：Arial；
字体大小：12px；
光标：指针；
溢出：隐藏；
保证金：3px 1px；
边境：1px solid # ff7300；
背景颜色：# FFF；
}
数李，{
颜色：# FFF；
行高：21px；
宽度：21px；
身高：21px；
字体大小：16px；
保证金：0 1px；
边界：0；
背景颜色：# ff7300；
字体粗细：粗体；
}








一
二
三



三。源代码
复制代码代码如下所示：
函数（id）{
返回字符串的身份document.getelementbyid = typeof（ID）：ID；
}；

var类{ { {
创建：函数（）{
返回函数（）{
This.initialize.apply（这个参数）；
}
}
}

object.extend =函数（目标，源）{
对于（源代码中的var属性）{
目的地{属性}；
}
返回目的地；
}

无功transformview = class.create（）；
transformview.prototype = { {
容器对象，滑动对象，开关参数，开关量
初始化函数（容器，滑块，参数，计数，选项）{
如果（参数小于0 | |计数< = 0）返回；
无功ocontainer = $（容器），oslider = $（滑块），这为本；

索引= 0；当前索引

这个_timer = null； / /定时器
这个_slider = oslider； / /滑动的物体
这个_parameter =参数； / /切换参数
这个_count =计数| | 0； / /开关数量
这个_target = 0； / /目标参数

this.setoptions（选项）；

这个！this.options.up；
这一步= math.abs（这个选项。步骤）；
这个时间= Math.abs（这个选项。时间）；
这个，自动=！this.options.auto；
这个暂停= math.abs（这个选项。停顿）；
this.onstart = this.options.onstart；
this.onfinish = this.options.onfinish；

ocontainer.style.overflow =隐藏；
ocontainer.style.position =相对；

oslider.style.position =绝对；
oslider.style.top = oslider.style.left = 0；
}，
设置默认属性
setOptions：功能（选项）{
this.options = { / /默认值
起来：真的，是向上的（或向左）。
步骤：5 滑动变化率
10 时间：滑动延迟
自动：自动转换
2000暂停：暂停时间（自动有效）
OnStart：（功能）{ }， / /执行开始转换
OnFinish：（功能）{} / /完成转换的执行
}；
Object.extend（this.options，选项| | { }）；
}，
启动/切换设置
开始：函数（）{
如果（this.index＜0）{
这个指数=这_count - 1；
否则如果}（this.index > =这。_count）{ this.index = 0；}

这个_target = 1 *本。_parameter *本。指数；
This.onStart（）；
这（移动）；
}，
莫比尔
移动：函数（）{
ClearTimeout（这个。_timer）；
VaR这=，=这风格，顶：左
我现在= parseInt（这个。_slider。风格{风格}）| | 0，
（这步= this.getstep。_target，现在）；

如果（ISTEP！= 0）{
这个_slider。风格{风格} =（现在+步）+PX；
这个_timer = setTimeout（函数（）{（）；}，这othis.move。时间）；
{人}
这个_slider。风格{ } =这风格。_target +PX；
this.onfinish（）；
如果（这。汽车）{这。_timer = setTimeout（）函数（{这。指数+ +；o（）；}。开始，这个停顿）}；}
}
}，
获得/步骤
getstep：功能（指标，现在）{
VaR ISTEP =（指标-现在）/这一步；
如果（ISTEP = = 0）返回0；
如果（Math.abs（步）：01 - 1）；
返回步；
}，
停止
停止：功能（指标，现在）{
ClearTimeout（这个。_timer）；
这个_slider。风格{ this.up顶：左} =这。_target +PX；
}
}；

窗口。指针函数（）{
函数每个（列表，乐趣）{
对于（var i = 0，len = list.length；我< len；i++）{有趣（名单{我}，我）；}
}；

var obj = $（idnum2 ），GetElementsByTagName（李）；

VaR电视=新transformview（idtransformview2
OnStart：（功能）{每（对象、函数（O，I）{ o.classname =电视。指数= = 我；}）}， / /按钮风格
：假
}）；

电视，开始（）；

每个（对象，函数（O，I）{
o.onmouseover =函数（）{
o.classname = ；
电视，自动=假；
电视。索引= i；
电视，开始（）；
}
o.onmouseout =函数（）{
o.classname = ；
电视，自动=真的；
电视，开始（）；
}
}）
}

一看名字就清楚了，所以不要细说代码！
演示和源文件下载