首頁 > web前端 > js教程 > js打字特效程式碼分享

js打字特效程式碼分享

小云云
發布: 2018-03-02 13:12:11
原創
1438 人瀏覽過

本文主要跟大家分享js打字特效程式碼,希望能幫助大家。



1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

<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>

登入後複製

相關推薦:

javascript實作自動輸出文字(打字特效)_javascript技巧

#

以上是js打字特效程式碼分享的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板