function (global) {
  var logo = document.getElementById('logo');
  var text = document.createTextNode('');
  logo.appendChild(text);

  var str = "Welcome to FoOTOo Lab";
  var timer = setInterval(writer, 100);
  var count = 0;

  function writer() {
    if (count == str.length)
      return clearInterval(timer);
    text.textContent += str[count];
    count++;
}

HTML DOM setInterval() 方法

定义和用法

setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

语法

setInterval(code,millisec[,"lang"])
参数 描述
code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔,以毫秒计。

返回值

一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。

js文字滚动效果的更多相关文章

  1. js文字滚动效果实现

    纯js实现,完整代码如下: <!doctype html> <html lang="en"> <head> <meta http-equi ...

  2. Flash 开发环境搭建和文字滚动效果实例

    Flash 开发环境搭建和文字滚动效果实例 一.Flash 开发环境搭建 Flash发布的时候可以将资源(即将库中的元件)集成到swf运行文件中.Flash没有代码自动输入补全功能,因此需要一个英文一 ...

  3. android采用SurfaceView实现文字滚动效果

    前言 为了实现文字的滚动效果,之前也重写了TextView效果都不太好,后来对SurfaceView进行完善. 声明     欢迎转载,但请保留文章原始出处:)  小崔博客:http://blog.c ...

  4. 在AxureRP8中实现广告文字滚动效果

    本文是实现动态文字在一个区域中滚动的效果,大概实现过程如下: 先准备一个区域,然后让文字在该区域内水平移动,本文是实现了从右到左的轮询的效果,其他雷同. 在Axure中,这种移动的过程需要动态移动,利 ...

  5. JS文字翻滚效果

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

  6. js 无缝滚动效果学习

    <!DOCTYPE html> <html> <head> <title>无缝滚动测试</title> <meta http-equi ...

  7. js文字转移效果

    这个例子算是有点样子的. 思路: 字符串操作.左框里面先是预设的.点击按钮时截取左框中的字符串的前一个字符到右框里的字符串后面,以此循环.点击按钮时按钮变为灰色,在循环完成后恢复.计数的总数(右边)是 ...

  8. js文字跳动效果

    /*! * chaffle v1.0.0 * * Licensed under MIT * Copyright 2013-2014 blivesta * http://blivesta.com */ ...

  9. js文字滚动

      <style type="text/css">  #gongao{width:1000px;height:30px;overflow:hidden;line-hei ...

随机推荐

  1. [NOIP2018]赛道修建(二分+multiset)

    考场上打了一个 \(vector\) 解法,因为我当时不会 \(multiset\) 好吧,我来讲一讲今年的 \(tgD1T3\) 首先,这题 \(55\) 分是不难想的 1. \(b_i=a_i+1 ...

  2. Spring Boot中使用Swagger2构建RESTful API文档

    在开发rest api的时候,为了减少与其他团队平时开发期间的频繁沟通成本,传统做法我们会创建一份RESTful API文档来记录所有接口细节,然而这样的做法有以下几个问题: 1.由于接口众多,并且细 ...

  3. Python UDP实例

    UDP通信过程 udp 不需要经过3次握手和4次挥手,不需要提前建立连接,直接发数据就行. server端 import socket BUFSIZE = 1024 ip_port = ('127.0 ...

  4. android studio 一直卡在Gradle:Build Running的解决办法

    转:android studio 一直卡在Gradle:Build Running的解决办法   在使用AS开发安卓应用程序的时候经常会遇到Gradle build running一直在运行甚至卡死的 ...

  5. ActiveMq使用笔记

    java JMS技术 .1.   什么是JMS JMS即Java消息服务(Java Message Service)应用程序接口是一个Java平台中关于面向消息中间件(MOM)的API,用于在两个应用 ...

  6. Qt中QMenu的菜单关闭处理方法

    Qt中qmenu的实现三四千行... 当初有个特殊的需求, 要求菜单的周边带几个像素的阴影, 琢磨了半天, 用QMenu做不来, 就干脆自己用窗口写一个 然而怎么让菜单消失却非常麻烦 1. 点击菜单项 ...

  7. web的脚本安全-XSS

    XSS,即Cross Site Scripting,叫X是因为之前有了一个CSS.中文可以叫跨站脚本攻击.是前端工程师的一大威胁. XSS的根本,就是有恶意用户把代码植入了你要访问的页面中,从而控制你 ...

  8. Kafka消费异常处理

    org.apache.kafka.clients.consumer.CommitFailedException: Commit cannot be completed since the group ...

  9. 理解Golang包导入

    Golang使用包(package)这种语法元素来组织源码,所有语法可见性均定义在package这个级别,与Java .python等语言相比,这算不上什么创新,但与C传统的include相比,则是显 ...

  10. linux查看系统的硬件信息【转】

    linux查看系统的硬件信息,并不像windows那么直观,这里我罗列了查看系统信息的实用命令,并做了分类,实例解说. cpu lscpu命令,查看的是cpu的统计信息. blue@blue-pc:~ ...