Class Of Marquee Scroll通用不間斷滾動(dòng)JS封裝類第1/2頁
更新時(shí)間:2008年07月03日 08:44:43 作者:
MSClass (Class Of Marquee Scroll通用不間斷滾動(dòng)JS封裝類) Ver 1.65
制作時(shí)間:2006-08-29 (Ver 0.5)
發(fā)布時(shí)間:2006-08-31 (Ver 0.8)
更新時(shí)間:2007-12-28 (Ver 1.65)
更新說明: + 加入功能 * 修正、完善
1.65.071228
* 橫向、縱向滾動(dòng)格式調(diào)整 (解決橫向滾動(dòng)換行的問題,無需特殊設(shè)置)
* 徹底解決由于IE問題導(dǎo)致上下滾動(dòng)頁面留白的問題 (本次更新主要解決此問題,感謝天上的書生參與測(cè)試)
1.6.070131
+ 禁止鼠標(biāo)控制暫停或繼續(xù) (將第9個(gè)參數(shù)設(shè)置為-1或者動(dòng)態(tài)賦值將ScrollSetp設(shè)置為-1)
+ 判斷是否可以滾動(dòng) (若內(nèi)容區(qū)域小于顯示區(qū)域,則自動(dòng)取消滾動(dòng))
+ 跳過初始化錯(cuò)誤 (避免引起其它滾動(dòng)的停止)
+ 默認(rèn)值 (除容器ID必選外,其他參數(shù)均可根據(jù)情況進(jìn)行選擇設(shè)置)
+ 參數(shù)動(dòng)態(tài)賦值 (方向可用英文表示top|up|bottom|down|left|right,使其更直觀、方便)
* 文字滾動(dòng)不準(zhǔn)確 (本次更新主要目的解決此Bug,感謝周珺參與測(cè)試)
1.4.061211
+ 鼠標(biāo)懸停改變滾動(dòng)方向 (鼠標(biāo)懸??刂谱笥覞L動(dòng))
* 由于文檔下載過慢而導(dǎo)致獲取的高度/寬度不準(zhǔn)確
* 瀏覽器兼容問題 (IE、FF、Opera、NS、MYIE)
1.2.060922
+ 指定范圍間歇滾動(dòng)
* 程序調(diào)整
* 連續(xù)間歇滾動(dòng)停止的錯(cuò)誤
1.0.060901
+ 向下、向右滾動(dòng)
+ 開始等待時(shí)間
+ 連續(xù)滾動(dòng)
* 調(diào)整時(shí)間單位
* 滾動(dòng)誤差
* 隨機(jī)死循環(huán)
* 加強(qiáng)性能
* 程序優(yōu)化
0.8.060829
翻屏不間斷向上、向左滾動(dòng)
[code]
<!--
/*MSClass (Class Of Marquee Scroll通用不間斷滾動(dòng)JS封裝類) Ver 1.65*\
制作時(shí)間:2006-08-29 (Ver 0.5)
發(fā)布時(shí)間:2006-08-31 (Ver 0.8)
更新時(shí)間:2007-12-28 (Ver 1.65)
更新說明: + 加入功能 * 修正、完善
1.65.071228
* 橫向、縱向滾動(dòng)格式調(diào)整 (解決橫向滾動(dòng)換行的問題,無需特殊設(shè)置)
* 徹底解決由于IE問題導(dǎo)致上下滾動(dòng)頁面留白的問題 (本次更新主要解決此問題,感謝天上的書生參與測(cè)試)
1.6.070131
+ 禁止鼠標(biāo)控制暫?;蚶^續(xù) (將第9個(gè)參數(shù)設(shè)置為-1或者動(dòng)態(tài)賦值將ScrollSetp設(shè)置為-1)
+ 判斷是否可以滾動(dòng) (若內(nèi)容區(qū)域小于顯示區(qū)域,則自動(dòng)取消滾動(dòng))
+ 跳過初始化錯(cuò)誤 (避免引起其它滾動(dòng)的停止)
+ 默認(rèn)值 (除容器ID必選外,其他參數(shù)均可根據(jù)情況進(jìn)行選擇設(shè)置)
+ 參數(shù)動(dòng)態(tài)賦值 (方向可用英文表示top|up|bottom|down|left|right,使其更直觀、方便)
* 文字滾動(dòng)不準(zhǔn)確 (本次更新主要目的解決此Bug,感謝周珺參與測(cè)試)
1.4.061211
+ 鼠標(biāo)懸停改變滾動(dòng)方向 (鼠標(biāo)懸??刂谱笥覞L動(dòng))
* 由于文檔下載過慢而導(dǎo)致獲取的高度/寬度不準(zhǔn)確
* 瀏覽器兼容問題 (IE、FF、Opera、NS、MYIE)
1.2.060922
+ 指定范圍間歇滾動(dòng)
* 程序調(diào)整
* 連續(xù)間歇滾動(dòng)停止的錯(cuò)誤
1.0.060901
+ 向下、向右滾動(dòng)
+ 開始等待時(shí)間
+ 連續(xù)滾動(dòng)
* 調(diào)整時(shí)間單位
* 滾動(dòng)誤差
* 隨機(jī)死循環(huán)
* 加強(qiáng)性能
* 程序優(yōu)化
0.8.060829
翻屏不間斷向上、向左滾動(dòng)
應(yīng)用說明:頁面包含<script type="text/javascript" src="MSClass.js"></script>
創(chuàng)建實(shí)例:
//參數(shù)直接賦值法
new Marquee("marquee")
new Marquee("marquee","top")
......
new Marquee("marquee",0,1,760,52)
new Marquee("marquee","top",1,760,52,50,5000)
......
new Marquee("marquee",0,1,760,104,50,5000,3000,52)
new Marquee("marquee",null,null,760,104,null,5000,null,-1)
//參數(shù)動(dòng)態(tài)賦值法
var marquee1 = new Marquee("marquee") *此參數(shù)必選
marquee1.Direction = "top"; 或者 marquee1.Direction = 0;
marquee1.Step = 1;
marquee1.Width = 760;
marquee1.Height = 52;
marquee1.Timer = 50;
marquee1.DelayTime = 5000;
marquee1.WaitTime = 3000;
marquee1.ScrollStep = 52;
marquee1.Start();
參數(shù)說明:
ID "marquee" 容器ID (必選)
Direction (0) 滾動(dòng)方向 (可選,默認(rèn)為0向上滾動(dòng)) 可設(shè)置的值包括:0,1,2,3,"top","bottom","left","right" (0向上 1向下 2向左 3向右)
Step (1) 滾動(dòng)的步長 (可選,默認(rèn)值為2,數(shù)值越大,滾動(dòng)越快)
Width (760) 容器可視寬度 (可選,默認(rèn)值為容器初始設(shè)置的寬度)
Height (52) 容器可視高度 (可選,默認(rèn)值為容器初始設(shè)置的高度)
Timer (50) 定時(shí)器 (可選,默認(rèn)值為30,數(shù)值越小,滾動(dòng)的速度越快,1000=1秒,建議不小于20)
DelayTime (5000) 間歇停頓延遲時(shí)間(可選,默認(rèn)為0不停頓,1000=1秒)
WaitTime (3000) 開始時(shí)的等待時(shí)間(可選,默認(rèn)或0為不等待,1000=1秒)
ScrollStep (52) 間歇滾動(dòng)間距 (可選,默認(rèn)為翻屏寬/高度,該數(shù)值與延遲均為0則為鼠標(biāo)懸??刂?-1禁止鼠標(biāo)控制)
使用建議:
1、建議直接賦予容器的顯示區(qū)域的寬度和高度,如(<div id="marquee" style="width:760px;height:52px;">......</div>)
2、建議為容器添加樣式overflow = auto,如(<div id="marquee" style="width:760px;height:52px;overflow:auto;">......</div>)
3、為了更準(zhǔn)確的獲取滾動(dòng)區(qū)域的寬度和高度,請(qǐng)盡可能將各滾動(dòng)單位直接賦予正確寬高度
4、對(duì)于TABLE標(biāo)記的橫向滾動(dòng),需要對(duì)TABLE添加樣式display = inline,如(<div id="marquee" style="width:760px;height:52px;overflow:auto;"><table style="display:inline">......</table></div>)
5、對(duì)于翻屏滾動(dòng)或間歇滾動(dòng),要注意各滾動(dòng)單位間的間距,同時(shí)需要對(duì)容器的可視高度和可視寬度做好準(zhǔn)確的設(shè)置,對(duì)于各滾動(dòng)單位間的間距可以通過設(shè)置行間距或者單元格的高寬度來進(jìn)行調(diào)整
6、對(duì)于LI自動(dòng)換行的問題暫時(shí)沒有更好的解決辦法,建議將其轉(zhuǎn)換成表格(TABLE)的形式來達(dá)到同等的效果
7、針對(duì)橫向滾動(dòng)的文字段落,如果最末端是以空格" "結(jié)束的,請(qǐng)將空格" "轉(zhuǎn)換成" "
8、鼠標(biāo)懸停滾動(dòng)思想源自Flash,所以有一定的局限性(容器內(nèi)僅允許用圖片<img>或者帶鏈接的圖片<a><img></a>的形式,并需要禁止其自動(dòng)換行)
感 謝:
天上的書生(QQ:30370740) (IE頁面留白的Bug) 2007/12/22
周珺 zhoujun#yuchengtech.com (文字滾動(dòng)跳行的bug) 2007/01/31
自本程序發(fā)布以來,收到不少朋友的郵件,提出了很多意見和建議,感謝大家的支持!
發(fā)布時(shí)間:2006-08-31 (Ver 0.8)
更新時(shí)間:2007-12-28 (Ver 1.65)
更新說明: + 加入功能 * 修正、完善
1.65.071228
* 橫向、縱向滾動(dòng)格式調(diào)整 (解決橫向滾動(dòng)換行的問題,無需特殊設(shè)置)
* 徹底解決由于IE問題導(dǎo)致上下滾動(dòng)頁面留白的問題 (本次更新主要解決此問題,感謝天上的書生參與測(cè)試)
1.6.070131
+ 禁止鼠標(biāo)控制暫停或繼續(xù) (將第9個(gè)參數(shù)設(shè)置為-1或者動(dòng)態(tài)賦值將ScrollSetp設(shè)置為-1)
+ 判斷是否可以滾動(dòng) (若內(nèi)容區(qū)域小于顯示區(qū)域,則自動(dòng)取消滾動(dòng))
+ 跳過初始化錯(cuò)誤 (避免引起其它滾動(dòng)的停止)
+ 默認(rèn)值 (除容器ID必選外,其他參數(shù)均可根據(jù)情況進(jìn)行選擇設(shè)置)
+ 參數(shù)動(dòng)態(tài)賦值 (方向可用英文表示top|up|bottom|down|left|right,使其更直觀、方便)
* 文字滾動(dòng)不準(zhǔn)確 (本次更新主要目的解決此Bug,感謝周珺參與測(cè)試)
1.4.061211
+ 鼠標(biāo)懸停改變滾動(dòng)方向 (鼠標(biāo)懸??刂谱笥覞L動(dòng))
* 由于文檔下載過慢而導(dǎo)致獲取的高度/寬度不準(zhǔn)確
* 瀏覽器兼容問題 (IE、FF、Opera、NS、MYIE)
1.2.060922
+ 指定范圍間歇滾動(dòng)
* 程序調(diào)整
* 連續(xù)間歇滾動(dòng)停止的錯(cuò)誤
1.0.060901
+ 向下、向右滾動(dòng)
+ 開始等待時(shí)間
+ 連續(xù)滾動(dòng)
* 調(diào)整時(shí)間單位
* 滾動(dòng)誤差
* 隨機(jī)死循環(huán)
* 加強(qiáng)性能
* 程序優(yōu)化
0.8.060829
翻屏不間斷向上、向左滾動(dòng)
[code]
<!--
/*MSClass (Class Of Marquee Scroll通用不間斷滾動(dòng)JS封裝類) Ver 1.65*\
制作時(shí)間:2006-08-29 (Ver 0.5)
發(fā)布時(shí)間:2006-08-31 (Ver 0.8)
更新時(shí)間:2007-12-28 (Ver 1.65)
更新說明: + 加入功能 * 修正、完善
1.65.071228
* 橫向、縱向滾動(dòng)格式調(diào)整 (解決橫向滾動(dòng)換行的問題,無需特殊設(shè)置)
* 徹底解決由于IE問題導(dǎo)致上下滾動(dòng)頁面留白的問題 (本次更新主要解決此問題,感謝天上的書生參與測(cè)試)
1.6.070131
+ 禁止鼠標(biāo)控制暫?;蚶^續(xù) (將第9個(gè)參數(shù)設(shè)置為-1或者動(dòng)態(tài)賦值將ScrollSetp設(shè)置為-1)
+ 判斷是否可以滾動(dòng) (若內(nèi)容區(qū)域小于顯示區(qū)域,則自動(dòng)取消滾動(dòng))
+ 跳過初始化錯(cuò)誤 (避免引起其它滾動(dòng)的停止)
+ 默認(rèn)值 (除容器ID必選外,其他參數(shù)均可根據(jù)情況進(jìn)行選擇設(shè)置)
+ 參數(shù)動(dòng)態(tài)賦值 (方向可用英文表示top|up|bottom|down|left|right,使其更直觀、方便)
* 文字滾動(dòng)不準(zhǔn)確 (本次更新主要目的解決此Bug,感謝周珺參與測(cè)試)
1.4.061211
+ 鼠標(biāo)懸停改變滾動(dòng)方向 (鼠標(biāo)懸??刂谱笥覞L動(dòng))
* 由于文檔下載過慢而導(dǎo)致獲取的高度/寬度不準(zhǔn)確
* 瀏覽器兼容問題 (IE、FF、Opera、NS、MYIE)
1.2.060922
+ 指定范圍間歇滾動(dòng)
* 程序調(diào)整
* 連續(xù)間歇滾動(dòng)停止的錯(cuò)誤
1.0.060901
+ 向下、向右滾動(dòng)
+ 開始等待時(shí)間
+ 連續(xù)滾動(dòng)
* 調(diào)整時(shí)間單位
* 滾動(dòng)誤差
* 隨機(jī)死循環(huán)
* 加強(qiáng)性能
* 程序優(yōu)化
0.8.060829
翻屏不間斷向上、向左滾動(dòng)
應(yīng)用說明:頁面包含<script type="text/javascript" src="MSClass.js"></script>
創(chuàng)建實(shí)例:
//參數(shù)直接賦值法
new Marquee("marquee")
new Marquee("marquee","top")
......
new Marquee("marquee",0,1,760,52)
new Marquee("marquee","top",1,760,52,50,5000)
......
new Marquee("marquee",0,1,760,104,50,5000,3000,52)
new Marquee("marquee",null,null,760,104,null,5000,null,-1)
//參數(shù)動(dòng)態(tài)賦值法
var marquee1 = new Marquee("marquee") *此參數(shù)必選
marquee1.Direction = "top"; 或者 marquee1.Direction = 0;
marquee1.Step = 1;
marquee1.Width = 760;
marquee1.Height = 52;
marquee1.Timer = 50;
marquee1.DelayTime = 5000;
marquee1.WaitTime = 3000;
marquee1.ScrollStep = 52;
marquee1.Start();
參數(shù)說明:
ID "marquee" 容器ID (必選)
Direction (0) 滾動(dòng)方向 (可選,默認(rèn)為0向上滾動(dòng)) 可設(shè)置的值包括:0,1,2,3,"top","bottom","left","right" (0向上 1向下 2向左 3向右)
Step (1) 滾動(dòng)的步長 (可選,默認(rèn)值為2,數(shù)值越大,滾動(dòng)越快)
Width (760) 容器可視寬度 (可選,默認(rèn)值為容器初始設(shè)置的寬度)
Height (52) 容器可視高度 (可選,默認(rèn)值為容器初始設(shè)置的高度)
Timer (50) 定時(shí)器 (可選,默認(rèn)值為30,數(shù)值越小,滾動(dòng)的速度越快,1000=1秒,建議不小于20)
DelayTime (5000) 間歇停頓延遲時(shí)間(可選,默認(rèn)為0不停頓,1000=1秒)
WaitTime (3000) 開始時(shí)的等待時(shí)間(可選,默認(rèn)或0為不等待,1000=1秒)
ScrollStep (52) 間歇滾動(dòng)間距 (可選,默認(rèn)為翻屏寬/高度,該數(shù)值與延遲均為0則為鼠標(biāo)懸??刂?-1禁止鼠標(biāo)控制)
使用建議:
1、建議直接賦予容器的顯示區(qū)域的寬度和高度,如(<div id="marquee" style="width:760px;height:52px;">......</div>)
2、建議為容器添加樣式overflow = auto,如(<div id="marquee" style="width:760px;height:52px;overflow:auto;">......</div>)
3、為了更準(zhǔn)確的獲取滾動(dòng)區(qū)域的寬度和高度,請(qǐng)盡可能將各滾動(dòng)單位直接賦予正確寬高度
4、對(duì)于TABLE標(biāo)記的橫向滾動(dòng),需要對(duì)TABLE添加樣式display = inline,如(<div id="marquee" style="width:760px;height:52px;overflow:auto;"><table style="display:inline">......</table></div>)
5、對(duì)于翻屏滾動(dòng)或間歇滾動(dòng),要注意各滾動(dòng)單位間的間距,同時(shí)需要對(duì)容器的可視高度和可視寬度做好準(zhǔn)確的設(shè)置,對(duì)于各滾動(dòng)單位間的間距可以通過設(shè)置行間距或者單元格的高寬度來進(jìn)行調(diào)整
6、對(duì)于LI自動(dòng)換行的問題暫時(shí)沒有更好的解決辦法,建議將其轉(zhuǎn)換成表格(TABLE)的形式來達(dá)到同等的效果
7、針對(duì)橫向滾動(dòng)的文字段落,如果最末端是以空格" "結(jié)束的,請(qǐng)將空格" "轉(zhuǎn)換成" "
8、鼠標(biāo)懸停滾動(dòng)思想源自Flash,所以有一定的局限性(容器內(nèi)僅允許用圖片<img>或者帶鏈接的圖片<a><img></a>的形式,并需要禁止其自動(dòng)換行)
感 謝:
天上的書生(QQ:30370740) (IE頁面留白的Bug) 2007/12/22
周珺 zhoujun#yuchengtech.com (文字滾動(dòng)跳行的bug) 2007/01/31
自本程序發(fā)布以來,收到不少朋友的郵件,提出了很多意見和建議,感謝大家的支持!
您可能感興趣的文章:
- JS與HTML結(jié)合使用marquee標(biāo)簽實(shí)現(xiàn)無縫滾動(dòng)效果代碼
- JQuery插件Marquee.js實(shí)現(xiàn)無縫滾動(dòng)效果
- div+css+js實(shí)現(xiàn)無縫滾動(dòng)類似marquee無縫滾動(dòng)兼容firefox
- 分別用marquee和div+js實(shí)現(xiàn)首尾相連循環(huán)滾動(dòng)效果,僅3行代碼
- js實(shí)現(xiàn)的類marquee水平循環(huán)滾動(dòng)
- javascript 模擬Marquee文字向左均勻滾動(dòng)代碼
- 用javascript實(shí)現(xiàn)代替marquee的滾動(dòng)字幕效果代碼
- 用javascript代替marquee的滾動(dòng)字幕效果代碼
- 再次更新!MSClass (Class Of Marquee Scroll通用不間斷滾動(dòng)JS封裝類 Ver 1.6)
- JS實(shí)現(xiàn)無縫循環(huán)marquee滾動(dòng)效果
相關(guān)文章
Class Of Marquee Scroll通用不間斷滾動(dòng)JS封裝類
MSClass (Class Of Marquee Scroll通用不間斷滾動(dòng)JS封裝類) Ver 1.652008-07-07一個(gè)輕量級(jí)的javascript庫 pj介紹
寫了一個(gè)輕量級(jí)的javascript庫,只支持一些簡單的選擇器,其中很多選擇器,方法借鑒了jQuery,命名為pj.2010-12-12可以把編碼轉(zhuǎn)換成 gb2312編碼lib.UTF8toGB2312.js
可以把編碼轉(zhuǎn)換成 gb2312編碼lib.UTF8toGB2312.js...2007-08-08