Rumah > hujung hadapan web > tutorial js > js打字特效代码分享

js打字特效代码分享

小云云
Lepaskan: 2018-03-02 13:12:11
asal
1349 orang telah melayarinya

本文主要和大家分享js打字特效代码,希望能帮助到大家。



<html>  
<head>  
<title>打字效果的带链接的新闻标题</title>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">  
<style type="text/css">  
body{font-size:14px;font-weight:bold;}  
</style>  
</head>  
<body>  
最新内容:<a id="HotNews" href="" target="_blank"></a>  
<script>  
var NewsTime = 2000;    //每条新闻的停留时间  
var TextTime = 50;      //新闻标题文字出现等待时间,越小越快  
var newsi = 0;  
var txti = 0;  
var txttimer;  
var newstimer;  
var newstitle = new Array();    //新闻标题  
var newshref = new Array();     //新闻链接  
newstitle[0] = "Jensen_Yao的博客";  
newshref[0] = "http://blog.csdn.net/jensen_yao";  
newstitle[1] = "http://blog.csdn.net/jensen_yao";  
newshref[1] = "http://blog.csdn.net/jensen_yao";  
newstitle[2] = "最高的效率就是对现有材料的最佳利用。";  
newshref[2] = "http://blog.csdn.net/jensen_yao";  
newstitle[3] = "学会偷懒!";  
newshref[3] = "http://blog.csdn.net/jensen_yao";  
newstitle[4] = "hello!";  
newshref[4] = "http://blog.csdn.net/jensen_yao";  
function shownew()  
{  
  var endstr = "_";  
  hwnewstr = newstitle[newsi];  
  newslink = newshref[newsi];  
  if(txti==(hwnewstr.length-1)){endstr="";}  
  if(txti>=hwnewstr.length){  
    clearInterval(txttimer);  
    clearInterval(newstimer);  
    newsi++;  
    if(newsi>=newstitle.length){  
      newsi = 0  
    }  
    newstimer = setInterval("shownew()",NewsTime);  
    txti = 0;  
    return;  
   }  
   clearInterval(txttimer);  
   document.getElementById("HotNews").href=newslink;  
   document.getElementById("HotNews").innerHTML = hwnewstr.substring(0,txti+1)+endstr;  
   txti++;  
   txttimer = setInterval("shownew()",TextTime);  
 }  
shownew();  
</script>  
<p><a href="http://www.108js.com" target="_blank">Jensen_Yao的博客</a></p>  
</body>  
</html>
Salin selepas log masuk

相关推荐:

javascript实现自动输出文本(打字特效)_javascript技巧

Atas ialah kandungan terperinci js打字特效代码分享. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan