原生js彈字效果

效果預覽:

手速不夠快,實際上是整體都是一個個崩出來的


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div style="width:100%;  margin:0px auto"> 
<div  id="language_two">

</div>
</div>
<script language="javascript">
    var index=0;
	let aa = 
	`我是一個沒得感情的殺手,
	一個工具人
	一個沒得感情的編碼工具
	一個木有心的人
	另外,我真的想喫燒烤,
	還有,請給我一個女同桌
	`
let alen = aa.length  
	let timer = null
    function type(){
		if(index === alen ){
			clearInterval(timer)
			return 
		}
		let currentWord = aa.substring(0,index )
		console.log(currentWord,`currentWord`)
        document.getElementById("language_two").innerText = currentWord + aa[index]
		index++ 
		console.log('++++')
    }
  timer =  setInterval(type, 100);
</script>
</body>
</html>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章