用JavaScript做升降文字的特殊效果

2025-10-29 01:43:49

1、setTimeout 方法，在执行时是在载入后延迟指定时间后，去执行一次表达式，仅执行一次。

2、CSS的 style.top 可以获得 html 元素距离上方或外层元素的位置，返回的是字符串。该属性可以赋值，根据不同的值，调整不同的距离。

3、<html>

<head>

<title>升降文字的特殊效果</title>

var done = 0; //完成标识

var step = 4; //单步变量

function anim(yp, yk) //函数:控制升降

{

if(document.layers) { //如果是非ie浏览器

document.layers["napis"].top = yp; //设置距离上面的高度

} else { //如果是ie浏览器

document.all["napis"].style.top = yp; //设置距离上面的高度

}

if(yp > yk) step = -4;

if(yp < 60) step = 4;

setTimeout('anim('+(yp+step)+','+yk+')', 35); //时间延时执行anim函数

}

function start()

{

if(done) return;

done = 1; //如果已经完成则返回

if(navigator.appName == "Netscape") { //如果是非ie浏览器

document.napis.left = innerwidth/2 - 145;

anim(60, innerHeight - 60);

} else { //如果是ie浏览器

napis.style.left = 120;

anim(60, document.body.offsetHeight - 60);

}

</script>

</head>

<body>

<h1>升降文字的特殊效果</h1>

<hr />

<br />

看，这行文字正在上下移动！

</div>

</center>

setTimeout('start()', 10); //时间延时执行start函数

</script>

</body>

</html>

4、运行该程序后，页面出现一个文字字符串，自动向下方缓缓移动。当移动到底部时又自动上升，如下图所示。字符串文字会像这样一直上下如电梯般往复循环。

5、

用JavaScript做升降文字的特殊效果

声明：本网站引用、摘录或转载内容仅供网站访问者交流或参考，不代表本站立场，如存在版权或非法内容，请联系站长删除，联系邮箱：site.kefu@qq.com。