设为首页 加入收藏
当前位置:首页 > 整站内容 > 特效代码 > 状态栏特效 > 详细内容
状态栏文字慢慢滑动显示
发布时间:2010-3-28  阅读次数:10454  字体大小: 【】 【】【

<html>
<head>
<title>网页特效|Linkweb.cn/Js|---状态栏文字慢慢滑动显示</title>
<style type="text/css">
<!--
body {   font-family: "宋体"; font-size: 9pt; margin-top: 0px; margin-left: 0px; margin-right: 0px}
A { COLOR: black; FONT-SIZE: 9pt; FONT-WEIGHT: 400; TEXT-DECORATION: none }
  A:hover { COLOR: red; FONT-SIZE: 9pt; FONT-WEIGHT: 400; TEXT-DECORATION: underline }
a:active         { font: 9pt "宋体"; cursor: hand; color: #FF0033 }

-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<SCRIPT LANGUAGE="JavaScript">
<!-- hide script from old browsers
var phrase = "精彩javascript特效,欢迎你的光临!!!";
var lenPhrase = phrase.length;
var phraseOut = "";
var pause = 25;
var i=0;
var j=0;
var animateWidth = 20;
var position=animateWidth;
function stack() {
       if (phrase.charAt(i) != " ") {
           phraseOut = "";
           for (j=0; j<i; j++) {
               phraseOut += phrase.charAt(j);
           }
           for (j=i; j<position; j++) {
               phraseOut += " ";
           }
           phraseOut += phrase.charAt(i);
           for (j=position; j<animateWidth; j++) {
               phraseOut += " ";
           }
           window.status = phraseOut;
           if (position == i) {
               animateWidth++;
               position = animateWidth;
               i++;
           }
           else {
               position--;
           }
       }
       else {
           i++
       }
       if (i<lenPhrase) {
               setTimeout("stack()",pause);
       }
}
// end hiding contents -->
</SCRIPT>
</head>

<body OnLoad="stack()">
<br>
<br>
<center><font color=red face="隶书" size=6>文字慢慢出现</font></center>
<br>
<center>
<table border=5 bordercolor=blue borderlight=green>
<tr><td align=center><font size=5 color=red face="Arial, Helvetica, sans-serif"><strong>状态栏为效果显示区!</strong></font></td></tr>
</table></center>
<br>
<br>
<center>
&nbsp;<SCRIPT LANGUAGE="JavaScript">

<!-- hide

function goHist(a)

{

     history.go(a);

}

//-->

</script></center>
<br>
<br>
</body>
</html>

预览效果

天猫商城    聚划算    天猫电器城    淘宝旅行    天猫超市    淘宝游戏    天猫品牌特卖    天猫母婴

我要评论
  • 匿名发表
  • [添加到收藏夹]
  • 发表评论:(匿名发表无需登录,已登录用户可直接发表。) 登录状态:未登录
最新评论
所有评论[0]
    暂无已审核评论!

全站链接: 
收录查询
分享按钮