javascript queue 打字效果
<!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(" ");
next();
}).delay(200,"dynamicStyle"); }); $("#content").dequeue("dynamicStyle");
});
</script>
</head>
<body>
<div id="content"></div>
</body>
</html>
javascript queue 打字效果的更多相关文章
- Javascript实现打字效果
伤感的 学期末 今天是这学期的最后一天,考完了最后一门数学,明天我们就要各自为自己的暑假打算打算了,所以趁着大家还没走一起出去打了打篮球,玩了玩轮滑,很累但是很开心,最大的感触莫过于忧伤额,明年我或许 ...
- javascript实现键盘自动打字效果
最近在网上看到一个字符逐个出现的打字效果,觉得挺有趣的,想一想基本实现思路就是设置一个定时器逐然后逐个向容器中添加字符,于是就基于jQuery写了一个简单版的. <!DOCTYPE html&g ...
- JavaScript实现动态打字效果
废话不多说,上代码~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
- jQuery模仿人类打字效果插件typetype
typetype是一款模仿人类打字效果的jQuery插件,typetype非常轻巧,文件不到2K,gzipped压缩后只有578字节,但模仿的效果非常逼真,一字一字的顿出和回删效果,让人惊叹不止,喜欢 ...
- JS打字效果的动态菜单代码分享
这篇文章主要介绍了JS打字效果的动态菜单,推荐给大家,有需要的小伙伴可以参考下. 这是一款基于javascript实现的打字效果的动态菜单特效代码,分享给大家学习学习. 小提示:浏览器中如果不能正常运 ...
- canvas打字效果
运用fillText,写的打字效果. 唯一麻烦的地方是,换行问题, 我是把字符串转化为数组,数组一个单位完成,就换行,继续下一个单位. <!doctype html> <html&g ...
- JS让网页上文字出现键盘打字的打字效果
一个挺简单的网页特效:JS让网页上文字出现键盘打字的打字效果实现 演示地址:http://codepen.io/guihailiuli/pen/jPOYMZ 以代码形式实现过程分析: <html ...
- CSS 实现打字效果
JS实现 最近做项目的时候需要实现一个字符逐个出现的打字效果,在网上一搜有个不错的jQuery插件Typed.js,效果很赞 <div class="element"> ...
- JavaScript 省市级联效果
JavaScript 省市级联效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...
随机推荐
- always on 技术
always on 技术系列:https://blog.csdn.net/dba_huangzj/article/details/54015470 MSSQL 2014 /WIN SERVER 200 ...
- SAP内存、ABAP内存、共享内存的 区别
区别: (1)SAP内存使用 SET/GET parameters 方法: SET PARAMETER ID ‘MAT’ field P_MATNR. GET PARAMETER ID ‘ ...
- Python基础-序列化(json/pickle)
我们把对象(变量)从内存中变成可存储的过程称之为序列化,比如XML,在Python中叫pickling,在其他语言中也被称之为serialization,marshalling,flattening等 ...
- Numpy用于数组的文件输入输出
这一章比较简单,内容也比较少.而且对于文件的读写,还是使用pandas比较好.numpy主要是读写文本数据和二进制数据的. 将数组以二进制的格式保存到硬盘上 主要的函数有numpy.save和nump ...
- 剑指offer 面试29题
面试29题: 题目:顺时针打印矩阵(同LeetCode 螺旋矩阵打印) 题:输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字,例如,如果输入如下矩阵: 1 2 3 4 5 6 7 8 9 ...
- MySQL数据库(7)_MySQL 数据备份与还原
一.数据备份 1.使用mysqldump命令备份 mysqldump命令将数据库中的数据备份成一个文本文件.表的结构和表中的数据将存储在生成的文本文件中. mysqldump命令的工作原理很简单.它先 ...
- Openstak(M版)计算节点安装
#############修改hosts文件 10.0.0.11 controller10.0.0.31 compute110.0.0.32 compute210.0.0.41 block110.0. ...
- Java中finalize()用法
Java中finalize() 垃圾回收器要回收对象的时候,首先要调用这个类的finalize方法(你可以 写程序验证这个结论),一般的纯Java编写的Class不需要重新覆盖这个方法,因为Obj ...
- Android开发BUG及解决方法1
错误描述: 问题1: Error:Execution failed for task ':app:transformClassesWithDexForDebug'. > com.Android. ...
- 20145230《java程序设计》第五次实验报告
20145230实验五 Java网络编程及安全 实验内容 掌握Socket程序的编写: 掌握密码技术的使用: 设计安全传输系统. 实验步骤 本次实验我负责编写客户端代码的编写,以下是我实验进行的步骤: ...