|
<Html>
<Head>
<Title> javascript code for multi-line news scrolling effect </title>
<Style>
Td {font-size: 12px ;}
</Style>
</Head>
<Body>
<Script>
/*************************************** *********************
* Rolling Effect
* Note: All parameters are required.
* @ Param {string} id: ID of the rolling layer to be bound
* @ Param direction {string/number} ction scroll direction top/up/0: up; bottom/down/1: down; left/2: left; right/3: right
* @ Param {number} Step rolling speed. The default value is 1. The larger the value, the slower the rolling speed.
* @ Param {number} width specifies the width of the scrolling layer. If it is set to 0, the width of the layer specified by the ID parameter is used.
* @ Param {number} height the height of the rolling layer. If it is set to 0, the height of the layer specified by the ID parameter is used.
* @ Param {number} timer rolling speed. The interval for moving 1 pixel is 30 milliseconds by default. If it is less than 20, it is 20.
* @ Param {number} delaytime the number of milliseconds between each scroll, usually 3000
* @ Param {number} waittime the number of seconds to wait before the first rolling, in milliseconds. The default value is 800. If it is less than 800, It is the default value.
* @ Param {number} The number of shards that scrollstep rolls each time
*
* @ Example
*
<Script defer>
New EAMarquee ("olist", 331,160, 5000,200 );
</Script>
<Div>
**************************************** **************************************** *********/
Function EAMarquee ()
{
This. ID = document. getElementById (arguments [0]);
If (! This. ID)
{
// Alert ("the" you want to set "+ arguments [0] +" "initialization error rn please check whether the tag ID settings are correct! ");
This. ID =-1;
Return;
}
This. Direction = this. Width = this. Height = this. DelayTime = this. WaitTime = this. CTL = this. StartID = this. Stop = this. MouseOver = 0;
This. Step = 1;
This. Timer = 30;
This. direarray array = {"top": 0, "up": 0, "bottom": 1, "down": 1, "left": 2, "right": 3 };
If (typeof arguments [1] = "number" | typeof arguments [1] = "string") this. Direction = arguments [1];
If (typeof arguments [2] = "number") this. Step = arguments [2];
If (typeof arguments [3] = "number") this. Width = arguments [3];
If (typeof arguments [4] = "number") this. Height = arguments [4];
If (typeof arguments [5] = "number") this. Timer = arguments [5];
If (typeof arguments [6] = "number") this. DelayTime = arguments [6];
If (typeof arguments [7] = "number") this. WaitTime = arguments [7];
If (typeof arguments [8] = "number") this. ScrollStep = arguments [8];
This. ID. style. overflow = this. ID. style. overflowX = this. ID. style. overflowY = "hidden ";
This. ID. noWrap = true;
This. IsNotOpera = (navigator. userAgent. toLowerCase (). indexOf ("opera") =-1 );
If (arguments. length> = 7) this. Start ();
}
EAMarquee. prototype. Start = function ()
{
If (this. ID =-1) return;
If (this. WaitTime <800) this. WaitTime = 800;
If (this. Timer <20) this. Timer = 20;
If (this. Width = 0) this. Width = parseInt (this. ID. style. width );
If (this. Height = 0) this. Height = parseInt (this. ID. style. height );
If (typeof this. Direction = "string") this. Direction = this. DirectionArray [this. Direction. toString (). toLowerCase ()];
This. HalfWidth = Math. round (this. Width/2 );
This. HalfHeight = Math. round (this. Height/2 );
This. BakStep = this. Step;
This. ID. style. width = this. Width + "px ";
This. ID. style. height = this. Height + "px ";
If (typeof this. ScrollStep! = "Number") this. ScrollStep = this. Direction> 1? This. Width: this. Height;
Var templateLeft = "<table cellspacing = '0' cellpadding = '0' border = '0' style = 'border-collapse: collapse; display: inline; '> <tr> <td noWrap = true style = 'white-space: nowrap; word-break: keep-all; '> MSCLASS_TEMP_HTML </td> <td noWrap = true style = 'white-space: nowrap; word-break: keep-all; '> MSCLASS_TEMP_HTML </td> </tr> </table> ";
Var templateTop = "<table cellspacing = '0' cellpadding = '0' boder = '0' style = 'border-collapse: collapse; '> <tr> <td> MSCLASS_TEMP_HTML </td> </tr> </table> ";
Var msobj = this;
Msobj. tempHTML = msobj. ID. innerHTML;
If (msobj. Direction <= 1)
{
Msobj. ID. innerHTML = templateTop. replace (/MSCLASS_TEMP_HTML/g, msobj. ID. innerHTML );
}
Else
{
If (msobj. ScrollStep = 0 & msobj. DelayTime = 0)
{
Msobj. ID. innerHTML + = msobj. ID. innerHTML;
}
Else
{
Msobj. ID. innerHTML = templateLeft. replace (/MSCLASS_TEMP_HTML/g, msobj. ID. innerHTML );
}
}
Var timer = this. Timer;
Var delaytime = this. DelayTime;
Var waittime = this. WaitTime;
Msobj. StartID = function () {msobj. Scroll ()}
Msobj. Continue = function ()
{
If (msobj. MouseOver = 1)
{
SetTimeout (msobj. Continue, delaytime );
}
Else
{ClearInterval (msobj. TimerID );
Msobj. CTL = msobj. Stop = 0;
Msobj. TimerID = setInterval (msobj. StartID, timer );
}
}
Msobj. Pause = function ()
{
Msobj. Stop = 1;
ClearInterval (msobj. TimerID );
SetTimeout (msobj. Continue, delaytime );
}
Msobj. Begin = function ()
{
Msobj. ClientScroll = msobj. Direction> 1? Msobj. ID. scrollWidth/2: msobj. ID. scrollHeight/2;
If (msobj. direction <= 1 & msobj. clientScroll <= msobj. height + msobj. step) | (msobj. direction> 1 & msobj. clientScroll <= msobj. width + msobj. step )){
Msobj. ID. innerHTML = msobj. tempHTML;
Delete (msobj. tempHTML );
Return;
}
Delete (msobj. tempHTML );
Msobj. TimerID = setInterval (msobj. StartID, timer );
If (msobj. ScrollStep <0) return;
Msobj. ID. onmousemove = function (event)
{
If (msobj. ScrollStep = 0 & msobj. Direction> 1)
{
Var event = event | window. event;
If (window. event)
{
If (msobj. IsNotOpera)
{
Msobj. EventLeft = event. srcElement. id = msobj. ID. id? Event. offsetX-msobj. ID. scrollLeft: event. srcElement. offsetLeft-msobj. ID. scrollLeft + event. offsetX;
}
Else
{
Msobj. ScrollStep = null;
Return;
}
}
Else
{
Msobj. EventLeft = event. layerX-msobj. ID. scrollLeft;
}
Msobj. Direction = msobj. EventLeft> msobj. HalfWidth? 3: 2;
Msobj. AbsCenter = Math. abs (msobj. HalfWidth-msobj. EventLeft );
Msobj. Step = Math. round (msobj. AbsCenter * (msobj. BakStep * 2)/msobj. HalfWidth );
}
}
Msobj. ID. onmouseover = function ()
{
If (msobj. ScrollStep = 0) return;
Msobj. MouseOver = 1;
ClearInterval (msobj. TimerID );
}
Msobj. ID. onmouseout = function ()
{
If (msobj. ScrollStep = 0)
{
If (msobj. Step = 0) msobj. Step = 1;
Return;
}
Msobj. MouseOver = 0;
If (msobj. Stop = 0)
{
ClearInterval (msobj. TimerID );
Msobj. TimerID = setInterval (msobj. StartID, timer );
}
}
}
SetTimeout (msobj. Begin, waittime );
}
EAMarquee. prototype. Scroll = function ()
{
Switch (this. Direction)
{
Case 0:
This. CTL + = this. Step;
If (this. CTL> = this. ScrollStep & this. DelayTime> 0)
{
This. ID. scrollTop + = this. ScrollStep + this. Step-this. CTL;
This. Pause ();
Return;
}
Else
{
If (this. ID. scrollTop> = this. ClientScroll)
{
This. ID. scrollTop-= this. ClientScroll;
}
This. ID. scrollTop + = this. Step;
}
Break;
Case 1:
This. CTL + = this. Step;
If (this. CTL> = this. ScrollStep & this. DelayTime> 0)
{
This. ID. scrollTop-= this. ScrollStep + this. Step-this. CTL;
This. Pause ();
Return;
}
Else
{
If (this. ID. scrollTop <= 0)
{
This. ID. scrollTop + = this. ClientScroll;
}
This. ID. scrollTop-= this. Step;
}
Break;
Case 2:
This. CTL + = this. Step;
If (this. CTL> = this. ScrollStep & this. DelayTime> 0)
{
This. ID. scrollLeft + = this. ScrollStep + this. Step-this. CTL;
This. Pause ();
Return;
}
Else
{
If (this. ID. scrollLeft> = this. ClientScroll)
{
This. ID. scrollLeft-= this. ClientScroll;
}
This. ID. scrollLeft + = this. Step;
}
Break;
Case 3:
This. CTL + = this. Step;
If (this. CTL> = this. ScrollStep & this. DelayTime> 0)
{
This. ID. scrollLeft-= this. ScrollStep + this. Step-this. CTL;
This. Pause ();
Return;
}
Else
{
If (this. ID. scrollLeft <= 0)
{
This. ID. scrollLeft + = this. ClientScroll;
}
This. ID. scrollLeft-= this. Step;
}
Break;
}
}
</Script>
<Div>
<Ul id = "olist" style = "font-size: 12px;">
<Li> <B> [Bosch] </B> Chengdu Guohui Trading Co., Ltd. </li>
<Li> <B> [mingguang brand] </B> Chengdu mingguang bellows Co., Ltd. </li>
<Li> <B> [chengsu] </B> Chengdu three Power Co., Ltd. (Sichuan cable factory) </li>
<Li> <B> [Five Stars] </B> botou Five Star High Temperature Oil Pump Plant Chengdu Office </li>
<Li> <B> [Yousheng] </B> Chengdu Shengda Weighing Apparatus Operations Department </li>
<Li> <B> [Three Gorges] </B> Chengdu Dongyuan building materials and chemical industry department </li>
<Li> <B> [Renault] </B> SHUNFA electric tools firm </li>
<Li> <B> [Bosch] </B> Chengdu Guohui Trading Co., Ltd. </li>
<Li> <B> [mingguang brand] </B> Chengdu mingguang bellows Co., Ltd. </li>
<Li> <B> [chengsu] </B> Chengdu three Power Co., Ltd. (Sichuan cable factory) </li>
<Li> <B> [Five Stars] </B> botou Five Star High Temperature Oil Pump Plant Chengdu Office </li>
<Li> <B> [Yousheng] </B> Chengdu Shengda Weighing Apparatus Operations Department </li>
<Li> <B> [Three Gorges] </B> Chengdu Dongyuan building materials and chemical industry department </li>
<Li> <B> [Renault] </B> SHUNFA electric tools firm </li>
</Ul>
<Script defer>
New EAMarquee ("olist", 331,160, 5000,200 );
</Script>
<Div>
</Body>
</Html> |
