使用jQuery.queue() 多个元素依次出现

发布时间:2020-07-30 04:05:30 作者:6566232
来源:网络 阅读:933

平日学习点滴


//use jQuery
<script type="text/javascript">
$(function() {
varjsonData = [{
cont: "加油!",
name: "guest"
}, {
cont: "加油!!",
name: "guest"
}, {
cont: "加油!!!",
name: "guest"
}];
$.each(jsonData, function(index, item) {
//解析添加DOM
$("#content").append("<span>"+ item.cont + "By:"+ item.name + "</span>").find('span').hide();
});
//队列数组,按顺序依次执行
//可以在此自定义效果
varqueue_list = [
function(){$("#content").find('span:eq(0)').fadeIn(200, _next);},
function(){$("#content").find('span:eq(1)').fadeIn(200, _next);},
function(){$("#content").find('span:eq(2)').fadeIn(200, _next);},
function(){$("#content").find('span:eq(0)').fadeOut(200, _next);},
function(){$("#content").find('span:eq(1)').fadeOut(200, _next);},
function(){$("#content").find('span:eq(2)').fadeOut(200, run);},
];
//执行下一个队列
var_next = function() {
$("#content").dequeue('_fx');
}
//执行第一个队列
varrun = function(){
$("#content").queue('_fx', queue_list).dequeue('_fx');
};
//run
run();
});
</script>


附件:http://down.51cto.com/data/2363948
推荐阅读:
  1. 如何在springboot中整合jquery和bootstrap框架
  2. CSS jquery圆角带阴影的导航菜单代码分享

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

jquery javascript queue

上一篇:ProxySQL

下一篇:BC网站搭建一条龙,AG接口对接一条龙搭建

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》