js: 文字定时切换

gavin_sw

于 2006-10-14 23:19:00 发布

阅读量5.2k

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： function transition javascript table html filter

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.youkuaiyun.com/gavin_sw/article/details/1334897

javascript 专栏收录该内容

11 篇文章

订阅专栏

本文展示了一段JavaScript代码，用于实现文字的定时切换效果。通过HTML和JavaScript结合，利用`FILTER: revealTrans`实现过渡动画，创建了一个不断更换内容的DIV元素。代码中定义了多个文字数组`imgTitle`，并通过`nextAd()`函数实现在指定间隔时间后自动切换文字内容。当鼠标悬停在元素上时，切换会暂停，离开后继续。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

下面的代码实现文字（图片同理）的切换显示：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE>gavin_sw</TITLE>

<META http-equiv=Content-Type content="text/html; charset=gbk">

</HEAD>

<BODY bgcolor="#000000">

<TABLE cellSpacing=0 cellPadding=0 align=center border=0>

<TR>

<TD vAlign=top bgColor=#fdfdf8>

<SCRIPT src="notice.js"></SCRIPT>

<DIV id=imgInit onmouseover=stopTimer();

style="FILTER: revealTrans(duration=2, transition=3); WIDTH: 154px; POSITION: absolute; HEIGHT: 160px; background-color:#FFFFFF"

onmouseout=startTimer()></DIV>

<SCRIPT language=JavaScript>...

var imgTitle=new Array();

imgTitle[1]="<br>aaaaaaaaaaaa__11<br><br>aaaaaaaaaaaa__22<br><br>aaaaaaaaaaaa__33<br>";

imgTitle[2]="<br>bbbbbbbbbbbb__11<br><br>bbbbbbbbbbbb__22<br><br>bbbbbbbbbbbb__33<br>";

imgTitle[3]="<br>cccccccccccc__11<br><br>cccccccccccc__22<br><br>cccccccccccc__33<br>";

imgTitle[4]="<br>dddddddddddd__11<br><br>dddddddddddd__22<br><br>dddddddddddd__33<br>";

nextAd(imgTitle.length);

</SCRIPT>

</TD>

</TR>

</TABLE>

</BODY>

</HTML>

//------------------ notice.js ------------------

var adNum=0;

var timerID = 4000;

function playTran(){

imgInit.filters.revealTrans.play();

}

function nextAd(){

if(adNum >= j){

adNum=1;

}

if(adNum != 0){

imgInit.filters.revealTrans.Transition=20;

imgInit.filters.revealTrans.apply();

imgInit.innerHTML=imgTitle[adNum];

playTran();

}

adNum++;

theTimer=setTimeout("nextAd()", timerID);

}

function stopTimer() {

window.clearTimeout(theTimer);

}

function startTimer() {

theTimer=setTimeout("nextAd()", timerID);

}

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。