<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>打印效果 测试</title>

    <style>

        body{

            background: #000;

        }

        #demo{

            font-family: helvetica;

            text-transform: uppercase;

            text-align: center;

            color: #fefefe;

            font-size: 200px;

            text-shadow: #e7e7e7 3px 5px 0, #999 4px 6px 3px, #ccc 8px 11px 10px;　　

        }

    </style>

</head>

<body>

    <div id="demo">

    </div>

    <script>

        var  str = "for example,再有几天都该七夕节了，你为她准备了什么礼物？"，

        　　 i =0，

        　　 cal；

        function demoStr(){

            if(i < str.length){

                cal = str.substring(0, i++) + "_";

                document.getElementById("demo").innerHTML = cal;

                setTimeout(demoStr,500);

            }else{

                document.getElementById("demo").innerHTML = str;　　//相当于清除下划线以及计时器效果

            }

        }

        demoStr();

    </script>

</body>

</html>

js 实现 文字打印效果的更多相关文章

  1. React.js实现原生js拖拽效果及思考

    一.起因&思路 不知不觉,已经好几天没写博客了...近来除了研究React,还做了公司官网... 一直想写一个原生js拖拽效果,又加上近来学react学得比较嗨.所以就用react来实现这个拖 ...

  2. 用js实现动画效果核心方式

    为了做好导航菜单,有时候需要在菜单下拉的时候实现动画效果,所以这几天就研究了研究如何用js实现动画效果,实现动画核心要用到两个函数,一个是setTimeOut,另一个是setInterval. 下边我 ...

  3. js拖拽效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 原生JS实现分页效果2.0（新增了上一页和下一页，添加当前元素样式）

    虽然写的很烂,但至少全部都是自己写的,因为这个没有固定的顺序,所以就没有封装,如果你技术好的话,可以你写的分享给我,谢谢. <!DOCTYPE html><html lang=&qu ...

  5. 原生JS实现分页效果1.0

    不太完整,写的太急,等等加上完整注释,写起来还是有些难度的,写的有点水,后面再改进改进. <!DOCTYPE html><html lang="en">&l ...

  6. 使用JS实现手风琴效果

    想要实现简单的手风琴切换效果,需要使用JS实现,如下是使用javascript源码实现,后续会更新使用jQuery实现. 1. 先进行简单的布局:我们可以再ul下添加几个li实现html的简单布局,再 ...

  7. js弹窗登录效果(源码)--web前端

    1.JS弹窗登录效果 <!DOCTYPE html><html lang="en"><head> <meta charset=" ...

  8. 原生JS实现弹幕效果

    纯属无聊写的,可能有很多问题,欢迎批评指教. 效果图:图一是预设的一些弹幕,图二是自己发射的弹幕,效果是一样的.   首先是弹幕的位置,是要从最右滑到最左,为了防止随机高度弹幕会覆盖的问题,设置了通道 ...

  9. JS添加标签效果

    JS添加标签效果 在豆瓣网上添加自己的标签是一种常见的效果,今天也就做了一个简单的demo.由于时间的问题 我不多原理,大家可以试着操作几遍就能明白其中的原理了. JSFiddle的效果如下: 点击我 ...

随机推荐

  1. Mysql插入Emoji表情出错

    Caused by: java.sql.SQLException: Incorrect at com.mysql.jdbc.SQLError.createSQLException(SQLError.j ...

  2. The Internet Communications Engine (Ice) 跨平台异构通讯方案 第二弹-Hello world！

    如果不知道ICE是什么的同学,请看上一篇的ICE简介:http://www.cnblogs.com/winds/p/3864677.html 好了,HelloWorld,从中间语言讲起. 首先,我们新 ...

  3. mysql8.0 安装 修改密码 允许远程连接

    转自:https://www.cnblogs.com/xyabk/p/8967990.html mysql从5.7一下子跳跃到了8.0,其中的改变还是很大,有点这里就不说了,小伙伴们自己去百度了解一下 ...

  4. python--boto3 之 与dynamoDB 的基本交互，表的备份与恢复

    最近因工作需要,研究了一下boto3中dynamoDB部分,略有心得,在此总结一下. 首先是boto3的安装,在装有python和pip的机器上,运行 sudo pip install boto3 官 ...

  5. 用户登录时，获取用户ip地址

    使用django来获取用户访问的IP地址,如果用户是正常情况下通过request.META['REMOTE_ADDR']  可以获得用户的IP地址.但是有些网站服务器会使用ngix等代理http,或者 ...

  6. CSS背景相关属性

    CSS样式可以精确控制HTML元素的背景.边框的样式和外观,也可以精确控制边框的线型和形状.其中,背景相关属性可以用于控制背景色.背景图片等属性.在控制背景图片的同时还可以控制背景图片的排列方式. 常 ...

  7. hiho一下 第一周 最长回文子串

    时间限制:1000ms 单点时限:1000ms 内存限制:64MB 描述 小Hi和小Ho是一对好朋友,出生在信息化社会的他们对编程产生了莫大的兴趣,他们约定好互相帮助,在编程的学习道路上一同前进. 这 ...

  8. python读写不同编码txt文件

        以后整理规范 import os import codecs filenames=os.listdir(os.getcwd()) out=file("name.txt",& ...

  9. Hadoop Archives档案

    HDFS 并不擅长存储小文件,因为每个文件最少一个 block,每个 block 的元数据都会在 NameNode 占用内存,如果存在大量的小文件,它们会吃掉NameNode 节点的大量内存. Had ...

  10. 【NLP_Stanford课堂】文本分类2

    一.实验评估参数 实验数据本身可以分为是否属于某一个类(即correct和not correct),表示本身是否属于某一类别上,这是客观事实:又可以按照我们系统的输出是否属于某一个类(即selecte ...