<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>jquery queue</title>

    <script src="framework/jquery-1.10.2.min.js"></script>

    <script>

        var content = "javascript is a good language!!";

        $(function(){

            function callback(){

                console.log(this);

            }

            function notify(word){

                console.log("notify:" + word);

                $("#content").append(word);

            }

            var arr = content.split(' ');

            $.each(arr,function(index,item){

                for(var i=0; i<item.length; i++) {

                    // console.log(i + " !!i = " + (!!i) + (!i));

                    (function(word){

                        $("#content").queue("dynamicStyle", function(next){

                            callback.call($(this));

                            notify(word);

                            next();

                        }).delay(200,"dynamicStyle");

                    })(item[i]);

                }

                $("#content").queue("dynamicStyle", function(next){

                            callback.call($(this));

                            notify("&nbsp;");

                            next();

                }).delay(200,"dynamicStyle");

            });

            $("#content").dequeue("dynamicStyle");

        });

    </script>

</head>

<body>

    <div id="content"></div>

</body>

</html>

javascript queue 打字效果的更多相关文章

  1. Javascript实现打字效果

    伤感的 学期末 今天是这学期的最后一天,考完了最后一门数学,明天我们就要各自为自己的暑假打算打算了,所以趁着大家还没走一起出去打了打篮球,玩了玩轮滑,很累但是很开心,最大的感触莫过于忧伤额,明年我或许 ...

  2. javascript实现键盘自动打字效果

    最近在网上看到一个字符逐个出现的打字效果,觉得挺有趣的,想一想基本实现思路就是设置一个定时器逐然后逐个向容器中添加字符,于是就基于jQuery写了一个简单版的. <!DOCTYPE html&g ...

  3. JavaScript实现动态打字效果

    废话不多说,上代码~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  4. jQuery模仿人类打字效果插件typetype

    typetype是一款模仿人类打字效果的jQuery插件,typetype非常轻巧,文件不到2K,gzipped压缩后只有578字节,但模仿的效果非常逼真,一字一字的顿出和回删效果,让人惊叹不止,喜欢 ...

  5. JS打字效果的动态菜单代码分享

    这篇文章主要介绍了JS打字效果的动态菜单,推荐给大家,有需要的小伙伴可以参考下. 这是一款基于javascript实现的打字效果的动态菜单特效代码,分享给大家学习学习. 小提示:浏览器中如果不能正常运 ...

  6. canvas打字效果

    运用fillText,写的打字效果. 唯一麻烦的地方是,换行问题, 我是把字符串转化为数组,数组一个单位完成,就换行,继续下一个单位. <!doctype html> <html&g ...

  7. JS让网页上文字出现键盘打字的打字效果

    一个挺简单的网页特效:JS让网页上文字出现键盘打字的打字效果实现 演示地址:http://codepen.io/guihailiuli/pen/jPOYMZ 以代码形式实现过程分析: <html ...

  8. CSS 实现打字效果

    JS实现 最近做项目的时候需要实现一个字符逐个出现的打字效果,在网上一搜有个不错的jQuery插件Typed.js,效果很赞 <div class="element"> ...

  9. JavaScript 省市级联效果

    JavaScript 省市级联效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

随机推荐

  1. Andrew Ng机器学习编程作业: Linear Regression

    编程作业有两个文件 1.machine-learning-live-scripts(此为脚本文件方便作业) 2.machine-learning-ex1(此为作业文件) 将这两个文件解压拖入matla ...

  2. java NIO 模型（一）

    1. 阻塞I/O通信模型 1.性能:一连接一线程模型导致服务端的并发接入数和系统吞吐量受到极大限制 2.可靠性:由于IO操作采用同步阻塞模式,当网络拥塞或者逻辑处理缓慢会导致IO线程被挂住,阻塞时间无 ...

  3. NodeJS的一些总结

    NodeJS的一些总结 Node 公开宣称的目标是 “旨在提供一种简单的构建可伸缩网络程序的方法”. 当前的服务器程序有什么问题?我们来做个数学题. 在 Java™ 和 PHP 这类语言中,每个连接都 ...

  4. django事物回滚

    往数据库写入数据时,不经意间就会写入不完整的数据,我们称之为脏数据.事务管理(transaction)可以防止这种情况发生.事务管理一旦检测到写入异常,会执行回滚操作,即要么写入完整的数据,要么不写入 ...

  5. OC知识点(类方法,构造方法,组合模式,get,set方法,自动生成属性)

    1.类方法的优势 不用创建对象,节省了空间,直接用类名调用类方法,类方法为外界提供一个方便的调用接口.(特点:类方法以加号开头,不能使用自身的成员变量,它的调用不依赖成员变量) 2.构造方法(初始化成 ...

  6. 每天一个Linux命令（55）systemctl命令

    systemctl命令是系统服务管理器指令,它实际上将 service 和 chkconfig 这两个命令组合到一起.     (1)用法:     用法:  systemctl  [参数]  [服务 ...

  7. SpringBoot Redis工具类封装

    1.接口类 package com.sze.redis.util; import java.util.List; import java.util.Set; import java.util.conc ...

  8. 多个网络请求成功返回再执行另外任务的思路分析（iOS）

    前言 今天我们来讨论一个经常出现的需求场景,也是一个老话题.在开发中我们往往会遇到需要进行多个网络请求,并且需要多个网络请求成功返回后再做其他事的场景.比如同一个界面显示的内容需要用到两个网络接口,而 ...

  9. STM32探秘 之FSMC

    源:STM32探秘 之FSMC STM32 FSMC总线深入研究

  10. Hadoop单机搭建

    单机Hadoop搭建 1.下载hadoop-2.7.3.tar.gz http://www.apache.org/dyn/closer.cgi/hadoop/common/hadoop-2.7.3/h ...