ホームページ >ウェブフロントエンド >jsチュートリアル >ノンストップ スクロール JS パッケージング クラスは基本的にすべてのスクロール効果を実現できます。これはあまりにも強力な JavaScript スキルです

ノンストップ スクロール JS パッケージング クラスは基本的にすべてのスクロール効果を実現できます。これはあまりにも強力な JavaScript スキルです

WBOY
WBOYオリジナル
2016-05-16 19:07:30900ブラウズ

/*MSClass (Class Of Marquee Scroll通用不间断滚动JS封装类) Ver 1.6*\ 

 制作时间:2006-08-29 (Ver 0.5) 
 发布时间:2006-08-31 (Ver 0.8) 
 更新时间:2007-01-31 (Ver 1.6) 
 更新说明: + 加入功能 * 修正、完善 
    1.6.070131 
        + 禁止鼠标控制暂停或继续 (将第9个参数设置为-1或者动态赋值将ScrollSetp设置为-1) 
        + 判断是否可以滚动 (若内容区域小于显示区域,则自动取消滚动) 
        + 跳过初始化错误 (避免引起其它滚动的停止) 
        + 默认值 (除容器ID必选外,其他参数均可根据情况进行选择设置) 
        + 参数动态赋值 (方向可用英文表示top|bottom|left|right,使其更直观、方便) 
        * 文字滚动不准确 (本次更新主要目的解决此Bug,感谢周珺参与测试) 
    1.4.061211 
        + 鼠标悬停改变滚动方向 (鼠标悬停控制左右滚动) 
        * 由于文档下载过慢而导致获取的高度/宽度不准确 
        * 浏览器兼容问题 (IE、FF、Opera、NS、MYIE) 
    1.2.060922 
        + 指定范围间歇滚动 
        * 程序调整 
        * 连续间歇滚动停止的错误 
    1.0.060901 
        + 向下、向右滚动 
        + 开始等待时间 
        + 连续滚动 
        * 调整时间单位 
        * 滚动误差 
        * 随机死循环 
        * 加强性能 
        * 程序优化 
    0.8.060829 
          翻屏不间断向上、向左滚动 

 演示地址:http://www.popub.net/script/MSClass.html 
 下载地址:http://www.popub.net/script/MSClass.js 

 应用说明:页面包含 

    创建实例: 
        //参数直接赋值法 
        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) 

        //参数动态赋值法 
        var marquee1 = new Marquee("marquee")    *此参数必选 
        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(); 

    参数说明: 
        ID        "marquee"    容器ID        (必选) 
        Direction    (0)        滚动方向    (可选,默认为0向上滚动) 可设置的值包括:0,1,2,3,"top","bottom","left","right" (0向上 1向下 2向左 3向右) 
        Step        (1)        滚动的步长    (可选,默认值为2,数值越大,滚动越快) 
        Width        (760)        容器可视宽度    (可选,默认值为容器初始设置的宽度) 
        Height        (52)        容器可视高度    (可选,默认值为容器初始设置的高度) 
        Timer        (50)        定时器        (可选,默认值为30,数值越小,滚动的速度越快,1000=1秒,建议不小于20) 
        DelayTime    (5000)        间歇停顿延迟时间(可选,默认为0不停顿,1000=1秒) 
        WaitTime    (3000)        开始时的等待时间(可选,默认或0为不等待,1000=1秒) 
        ScrollStep    (52)        间歇滚动间距    (可选,默认为翻屏宽/高度,该数值与延迟均为0则为鼠标悬停控制,-1禁止鼠标控制) 
 使用建议: 
        1、建议直接赋予容器的显示区域的宽度和高度,如(

......

        2、建议为容器添加样式overflow = auto,如(
......

        3、为了更准确的获取滚动区域的宽度和高度,请尽可能将各滚动单位直接赋予正确宽高度 
        4、对于TABLE标记的横向滚动,需要对TABLE添加样式display = inline,如(
......
)
5. 反転スクロールまたは断続的なスクロールの場合は、各スクロール単位間の間隔に注意する必要があります。同時に、各スクロール間の間隔について、コンテナの視覚的な高さと視覚的な幅を正確に設定する必要があります。単位として、行間隔またはセルの高さと幅を設定することで調整できます
6. 現時点では、LI の自動行折り返しの問題に対するこれより良い解決策はありません。テーブル (TABLE. ) 同じ効果を得るためにフォーム
7. 横ローリングテキストフィールドの場合、末尾がスペース "" で終了している場合は、スペース "" "" を変換してください
8. マウスホバーローリング思考が導出されますFlash からのものであるため、特定の制限があります ( 形式の画像、またはリンク を含む画像のみがコンテナ内で許可され、自動行折り返しを行う必要があります)

感謝:
Zhou Jun zhoujun#yuchengtech.com (テキスト スクロールのバグ) 2007/01/31
このプログラムのリリース以来、友人からたくさんのコメント付きのメールをたくさん受け取りましたご支援ありがとうございます。

*** 番組制作/著作権: Cui Yongxiang (333) 電子メール: zhadan007@21cn.com ウェブサイト: http://www.popub.net***/

コードをコピーします コードは次のとおりです:



在線演示
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。