小白练习打字机效果
来源：互联网 发布：淘宝商品图片手机制作 编辑：程序博客网 时间：2024/05/16 17:35
用js写了一个打字机效果，
其实并不是一个字一个字显示，
而是利用了interval，每隔300ms显示一次，造成视觉上的错觉。
虽然写的很辣鸡，但是还是很有意思哒！~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>打字机效果练习</title>
</head>
<body>
<div id="mytext" style="font-size: 30px"></div>
<script type="text/javascript">
var myt="js is amazing! let's do it!";//输入文字
var mj=document.getElementById("mytext");//定义要显示的文字
var i=0;
function change(){ //每隔0.3s执行一次函数
if(i<=myt.length){
mj.innerHTML=myt.substring(0,i); //每次多获取一个字符
i++;
}else{
window.clearInterval(interval);//清除时间间隔调用
}
}
var interval=window.setInterval(change,300);
</script>
</html>
0 0
- 小白练习打字机效果
- jQuery打字机小练习
- [练习1] js 学习之打字机效果
- 打字机效果
- 打字机效果展示
- jQuery的打字机效果
- Jquery打字机效果
- JavaScript打字机效果实现
- jquery实现打字机效果
- TextView打字机效果
- js实现打字机效果
- js打字机效果
- 文字打字机效果
- UGUI 打字机效果
- 【Unity】打字机效果
- UGUI打字机效果
- UGUI实现打字机效果
- JS打字机效果
- 区分事件的独立性与互不相容性
- Spark PG5. Shuffle 操作
- Python的MySQLdb模块安装
- Latex个人常用清单--不断更新
- 记一次使用开源代码的微博爬虫的经历
- 小白练习打字机效果
- 习题2-5 分数化小数
- Spark PG6. RDD 持久化
- BZOJ4726: [POI2017]Sabota?
- Android PopupWindow 使点击区域外不消失
- 大话数据结构8之栈和队列2
- Vivado HLS ap_fixed数据类型
- [maven]maven常用命令行
- 一道2016年美国高中数学竞赛题
