核心代码: 复制代代码如下: this.ID.noWrap = true; <BR>this.ID.style.width = this.Width; <BR>this.ID.style.height = this.Height; <BR>this.ClientScroll = this.Direction > 1? this.ID.scrollWidth : this.ID.scrollHeight; <BR>this.ID.innerHTML = this.ID.innerHTML; <BR>this.Start(this, this.Timer, this.WaitTime, this.StopTime); <BR>} <BR>Marquee.prototype.Start = function(msobj, timer, waittime, stoptime) { <BR>msobj.StartID = function() { msobj.Scroll(); } <BR>msobj.Continue = function() { <BR>if (msobj.MouseOver == 1) { setTimeout(msobj.Continue, waittime); <BR>else {clearInterval(msobj.TimerID); msobj.CTL = msobj.Stop = 0; msobj.TimerID = setInterval(msobj.StartID, timer); } <BR>} <BR>msobj.Pause = function() { msobj.Stop = 1; clearInterval(msobj.TimerID); setTimeout(msobj.Continue, waittime); <BR>msobj.Begin = function() { <BR>msobj.TimerID = setInterval(msobj.StartID, timer); <BR>msobj.ID.onmouseover = function() { msobj.MouseOver = 1; clearInterval(msobj.TimerID); } <BR>msobj.ID.onmouseout = function() { msobj.MouseOver = 0; if (msobj.Stop == 0) {clearInterval(msobj.TimerID); msobj.TimerID = setInterval(msobj.StartID, timer); <BR>} <BR>setTimeout(msobj.Begin, stoptime); <BR>} <BR>Marquee.prototype.Scroll = function() { <BR>switch (this.Direction) { <BR>case 0: <BR>this.CTL = this.Step; <BR>if (this.CTL >= this.ScrollStep && this.WaitTime > 0) { this.ID.scrollTop = this.ScrollStep this.Step - this.CTL; this.Pause();戻る; } <br>else { if (this.ID.scrollTop >= this.ClientScroll) this.ID.scrollTop -= this.ClientScroll; this.ID.scrollTop = this.Step; } <br>休憩; <br>ケース 1: <br>this.CTL = this.Step; <br>if (this.CTL >= this.ScrollStep && this.WaitTime > 0) { this.ID.scrollTop -= this.ScrollStep this.Step - this.CTL; this.Pause();戻る; } <br>else { if (this.ID.scrollTop 休憩; <br>ケース 2: <br>this.CTL = this.Step; <br>if (this.CTL >= this.ScrollStep && this.WaitTime > 0) { this.ID.scrollLeft = this.ScrollStep this.Step - this.CTL; this.Pause();戻る; } <br>else { if (this.ID.scrollLeft >= this.ClientScroll) this.ID.scrollLeft -= this.ClientScroll; this.ID.scrollLeft = this.Step; } <br>休憩; <br>ケース 3: <br>this.CTL = this.Step; <br>if (this.CTL >= this.ScrollStep && this.WaitTime > 0) { this.ID.scrollLeft -= this.ScrollStep this.Step - this.CTL; this.Pause();戻る; } <br>else { if (this.ID.scrollLeft 休憩; <br>} <br>} <br> 制御使用代码: 复制代記入代码如下: <br><!-- <br>window.onload = function() { <br>new Marquee( <br>"s1", //容器ID <br>0, //向上滚動(0向上1方向)下 2 方向左 3 方向右) <br>2, //動作の步長 <br>251, //容器可視度 <br>520, //容器可視高 <br>50, //タイマー数値が小さいほど、動作の速度が速くなります(1000=1,建議は20未満) <br>2000, //中停止時間(0は停止なし,1000=1秒) <br>3000, //開始時間の等待ち時間(0 は不等待ち時間、1000=1 秒) <br>75 //間移動距離 (選択可能)、行高であることを理解してください、私はここに 3*25=75、就は毎回の移動三行 <br>); <br>}; <br>--> <br> 効果デモンストレーション: <ul id="s1"> 以下は私の HTML コードです。何が起こっているかが一目でわかります。 <li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット<li> </li>法律や規制のある第三帝国の非公式の心霊スポット</ul> [Ctrl A すべて選択 注: 外部 Js を導入する必要がある場合は、 function Marquee() { this.ID = document.getElementById(arguments[0]); this.Direction = arguments[1]; this.Step = arguments[2]; this.Width = arguments[3]; this.Height = arguments[4]; this.Timer = arguments[5]; this.WaitTime = arguments[6]; this.StopTime = arguments[7]; if (arguments[8]) { this.ScrollStep = arguments[8]; } else { this.ScrollStep = this.Direction > 1 ? this.Width : this.Height; } this.CTL = this.StartID = this.Stop = this.MouseOver = 0; this.ID.style.overflowX = this.ID.style.overflowY = "hidden"; this.ID.noWrap = true; this.ID.style.width = this.Width; this.ID.style.height = this.Height; this.ClientScroll = this.Direction > 1 ? this.ID.scrollWidth : this.ID.scrollHeight; this.ID.innerHTML += this.ID.innerHTML; this.Start(this, this.Timer, this.WaitTime, this.StopTime); } Marquee.prototype.Start = function(msobj, timer, waittime, stoptime) { msobj.StartID = function() { msobj.Scroll(); } msobj.Continue = function() { if (msobj.MouseOver == 1) { setTimeout(msobj.Continue, waittime); } 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, waittime); } msobj.Begin = function() { msobj.TimerID = setInterval(msobj.StartID, timer); msobj.ID.onmouseover = function() { msobj.MouseOver = 1; clearInterval(msobj.TimerID); } msobj.ID.onmouseout = function() { msobj.MouseOver = 0; if (msobj.Stop == 0) { clearInterval(msobj.TimerID); msobj.TimerID = setInterval(msobj.StartID, timer); } } } setTimeout(msobj.Begin, stoptime); } Marquee.prototype.Scroll = function() { switch (this.Direction) { case 0: this.CTL += this.Step; if (this.CTL >= this.ScrollStep && this.WaitTime > 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.WaitTime > 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.WaitTime > 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.WaitTime > 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; } } を実行するために更新する必要があります] <!-- window.onload = function() { new Marquee( "s1", //容器ID 0, //向上滚动(0向上 1向下 2向左 3向右) 2, //滚动的步长 251, //容器可视宽度 520, //容器可视高度 50, //定时器 数值越小，滚动的速度越快(1000=1秒,建议不小于20) 2000, //间歇停顿时间(0为不停顿,1000=1秒) 3000, //开始时的等待时间(0为不等待,1000=1秒) 75 //间歇滚动间距(可选),可理解为行高，我这里是3*25=75，就是每次滚动三行 ); }; -->
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
