<!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. Oracle ErrorStack 使用和阅读具体解释

    一.概述 在Oracle数据库执行过程中,我们常常会遇到这样或那样的错误.可是错误的提示并不详细,加大了我们在诊断问题时的难度. ErrorStack是Oracle提供的一种对于错误堆栈进行跟踪的方法 ...

  2. Oracle索引（1）概述与创建索引

    索引是为了提高数据检索效率而创建的一种独立于表的存储结构,由Oracle系统自动进行维护. 索引的概述        索引是一种可选的与表或簇相关的数据库对象,能够为数据的查询提供快捷的存储路径,减少 ...

  3. Linux文件系统管理 常见命令df、du、fsck、dumpe2fs

    概述 Linux文件系统管理 常见命令df.du.fsck.dumpe2fs. 文件系统查看命令:df 通过 df 命令可以査看已经挂载的文件系统的信息包括设备文件名.文件系统总大小.已经使用的大小. ...

  4. Android BlueDroid（蓝牙协议栈）

    Android BlueDroid(一):BlueDroid概述 Android BlueDroid(二):BlueDroid蓝牙开启过程init Android BlueDroid(三):BlueD ...

  5. 【Head First Servlets and JSP】笔记7：如何创建一个全局的dog？

    重定向与请求分派 “局部”参数——ServletConfig——servlet初始化参数 “全局”参数——ServletContext——上下文初始化参数 Web app的“构造器”——Servlet ...

  6. Python多线程循环

    背景:Python脚本:读取文件中每行,放入列表中:循环读取列表中的每个元素,并做处理操作. 核心:多线程处理单个for循环函数调用 模块:threading 第一部分:   :多线程脚本 (该脚本只 ...

  7. K8s ipvs mode kube-proxy

    IPVS vs. IPTABLES IPVS模式在Kubernetes 1.8中被引入,在1.9中进入beta测试. IPTABLES模式在1.1版本中被添加进来,在1.2开始就变成了默认的操作模式. ...

  8. asp.net 5 (mvc 6) 获取网站的物理路径

    public static IApplicationEnvironment GetApplication(this RazorPage page) { var ae = page.Context.Re ...

  9. poj 1265 Area【计算几何：叉积计算多边形面积+pick定理计算多边形内点数+计算多边形边上点数】

    题目:http://poj.org/problem?id=1265 Sample Input 2 4 1 0 0 1 -1 0 0 -1 7 5 0 1 3 -2 2 -1 0 0 -3 -3 1 0 ...

  10. C++中容器的使用（一）

    C++中有两种类型的容器:顺序容器和关联容器. 顺序容器主要有vector.list.deque等.其中vector表示一段连续的内存,基于数组实现,list表示非连续的内存,基于链表实现,deque ...