<!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. mui 视频播放

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

  2. vue 项目 npm install 报错解决

    node-sass 安装报错解决办法 2017年04月15日 14:34:25 阅读数:20189 E:\kibana>npm install node-sass > node-sass@ ...

  3. Java多线程（Java总结篇）

    Java总结篇:Java多线程 多线程作为Java中很重要的一个知识点,在此还是有必要总结一下的. 一.线程的生命周期及五种基本状态 关于Java中线程的生命周期,首先看一下下面这张较为经典的图: 上 ...

  4. Loadrunder脚本篇——web_custom_request函数介绍

    c语言版本: int web_custom_request(const char *RequestName, , [EXTRARES, ,] LAST ); 参数说明: RequestName     ...

  5. iOS NSSet 学习 “无序数组” & 去重 案例

    “NSSet,NSMutableSet,和NSCountedSet类声明编程接口对象的无序集合(散列存储:在内存中的存储位置不连续). 而NSArray,NSDictionary类声明编程接口对象的有 ...

  6. iOS 事件响应者链的学习(也有叫 UI连锁链)

    当发生事件响应的时候,必须知道由谁来响应事件.在iOS中,由响应链来对事件进行响应,所有的事件响应的类都是继承于UIResponder的子类,响应链是一个由不同对象组成的层次结构,其中每个对象将依次获 ...

  7. java MD5Utils 加密工具类

    package com.sicdt.library.core.utils; import java.io.File; import java.io.FileInputStream; import ja ...

  8. Array排序方法sort()中的大坑

    sort() 方法用于对数组的元素进行排序. 但是排序结果就有点坑了,都不按常规出牌的: // 看上去正常的结果: ['Google', 'Apple', 'Microsoft'].sort(); / ...

  9. 一个不成熟的编程员，写写 js 的面向对象

    其实感觉本人 js 并未入门,甚至说也是个不合格的编程员,什么面向对象都不会,一直都往 Object 里面填方法,假装很对象的样子. 但学习嘛,这道坎还是得多试几下的,说不定就跨过去了呢. 个人喜欢用 ...

  10. Yii和ThinkPHP对比杂谈

    关于ThinkPHP(以下简称TP)和Yii Framework(以下简称Yii)的背景.作者和速度方面就不涉及了.因为速度是一个很复杂的问题,牵扯的因素很多.我不得不承认ThinkPHP是 一个是国 ...