5月最近在学Django,所以所有的Demo都没有PO出去

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script type="text/javascript"></script>
<title>打印机效果</title>
</head>
<body>
<pre class="aa"></pre>
<div style="display:none" class="w">Hello World </div>
<script>
var index=0;
var word=document.getElementsByClassName("w")[0].innerHTML;
function type(){
document.getElementsByClassName("aa")[0].innerText = word.substring(0,index++);
}
setInterval(type, 200);
</script>
<!--记得引入jquery文件哦-->
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>

JS实现HTML打印机效果的更多相关文章

  1. 原生JS封装简单动画效果

    原生JS封装简单动画效果 一致使用各种插件,有时候对原生JS陌生了起来,所以决定封装一个简单动画效果,熟悉JS原生代码 function animate(obj, target,num){ if(ob ...

  2. JS实现回到顶部效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. [JS,NodeJs]个人网站效果代码集合

    上次发的个人网站效果代码集合: 代码集合: 1.彩色文字墙[鼠标涟漪痕迹] 2.彩色旋转圆环 [模仿http://www.moma.org/interactives/exhibitions/2012/ ...

  4. turn.js实现翻书效果

    JS插件网 http://www.ijquery.cn/?p=173 描述:Turn.js 是一个轻量级的 (15kb) jQuery/html5 插件用来创建类似书本和杂志翻页效果,支持触摸屏设备. ...

  5. 面向对象原生js幻灯片代淡出效果

    面向对象原生js幻灯片代淡出效果 下面是代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" & ...

  6. Turn.js 实现翻书效果的学习与总结

    最近CTO给我分配了一个移动端H5开发的任务,主要功能是需要实现翻书效果,我听过主要需求后,当时是呀!!!接下来自己尝试使用fullPage.js和Swiper来实现翻书效果,结果效果都不是非常的理想 ...

  7. JS 文本输入框放大镜效果

    JS 文本输入框放大镜效果 今天下午研究了下 "文本输入框放大镜效果" 当然KISSY官网也有这种组件 请看kissy demo 其实这种效果 对于很多童鞋来说 应该并不陌生!我今 ...

  8. 原生js实现的放大镜效果

    这是我用原生js写的放大镜效果,与各种各样的框架技术相比,我喜欢使用原生的js,在这里,想和大家一起谈谈原生和框架技术的理解与个人喜好. <!DOCTYPE HTML><html&g ...

  9. JavaScript js无间断滚动效果 scrollLeft方法 使用模板

    JavaScript js无间断滚动效果 scrollLeft方法 使用模板 <!DOCTYPE HTML><html><head><meta charset ...

随机推荐

  1. 如何在php中优雅的地调用python程序

    1.准备工作   安装有python和php环境的电脑一台. 2.书写程序. php程序如下 我们也可以将exec('python test.py') 换成 system('python test.p ...

  2. UGUI实现打字的效果

    创建打字特效控制的脚本,将该脚本挂载都含有Text组件的对象上面,通过该脚本控制Text文本框的文字,以打字的效果显示文字. 脚本 using UnityEngine; using System.Co ...

  3. UVA455 - Periodic Strings(紫书习题3.4)

    如果一个字符串可以被某个长度为k的字符串重复多次得到,则称这个字符串的周期为k.例如,字符串"abcabcabcabc"以3为周期(当然,他也以6.12等等为周期).  现在请你编 ...

  4. [luogu2585 ZJOI2006] 三色二叉树 (树形dp)

    传送门 Description Input 输入文件名:TRO.IN 输入文件仅有一行,不超过500000个字符,表示一个二叉树序列. Output 输出文件名:TRO.OUT 输出文件也只有一行,包 ...

  5. eclipse 去掉Eclipse打开后定期弹出Usage Data Upload对话框

    Eclipse 的 UDC 老定期蹦出来说要上传使用数据到 eclipse 官网服务器去除方法: 1.删除 eclipse/plugins 目录下以 org.eclipse.epp.usagedata ...

  6. 关于idea控制台乱码问题

    乱码是常有的事儿,改一下也就两分钟......不多说看图: 上图中的勾选项一定不要忘记,它可以隐藏你项目中encoding设置. 在上图两个文件中加入 -Dfile.encoding=UTF-8 在上 ...

  7. Oracle的JDBC Url的几种方式

    1.普通SID方式jdbc:oracle:thin:username/password@x.x.x.1:1521:SID2.普通ServerName方式 jdbc:Oracle:thin:userna ...

  8. Ubuntu16.04编译cmake源码

    编译版本:cmake-3.8.0-rc2 为了能够编译出ccmake和cmake-gui,首先需要安装libncurses5-dev sudo apt install libncurses5-dev ...

  9. leetCode(32):Power of Two

    Given an integer, write a function to determine if it is a power of two. 2的幂的二进制表示中,必定仅仅有一个"1&q ...

  10. HDU 2054 A==B? 大数

    Problem Description Give you two numbers A and B, if A is equal to B, you should print "YES&quo ...