zoukankan
html css js c++ java
滚动双联广告
一个简单的效果,主要考验对queue的理解。
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>test-group-following</title> <!-- // <script type="text/javascript" src="../jquery-1.8.3.min.js"></script> --> <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script> <style type="text/css"> *{margin:0;padding:0;} body{font:12px/1.5 arial;background:#fff;} img{border:none 0;} .scroll{position:absolute;left:10px;} .scroll-outer{position:relative;145px;height:300px;} .scroll-cont{position:absolute;top:0;left:0;height:280px;border:1px solid #cc0;background:#f1f1f1;} .scroll-close{position:absolute;bottom:0;right:0;display:block;text-decoration:none;} .scroll-close:hover{color:#c00;} </style> </head> <body> <div style="height:3000px;"></div> <div class="scroll"> <div class="scroll-outer"> <div class="scroll-cont"> <a href="#" target="_blank"> <img width="143" height="280" src="http://guniangwang.com/user_upload_img/713/201212/s/20121231110033.jpg" alt="" /> </a> </div> <a href="javascript:void(0)" class="scroll-close">关闭</a> </div> </div> <script type="text/javascript"> (function($){ $.fn.dual = function(options){ var defaults = { delaytime : 1000 }, opts = $.extend(defaults, options), win = $(window), right = this.clone().appendTo('body'), // clone other center = (win.height() - this.height()) / 2, ele = $('.scroll'), close = ele.find('.scroll-close'); right.css({left: 'auto', right: '10px'}); // initialize return ele.each(function(){ var that = $(this); $(this).css({top: center}); win.scroll(function(){ that.animate({top: center + win.scrollTop()}, {duration: opts.delaytime, queue: false}); }); close.click(function(){ that.hide(); }); }); } }(jQuery)); $('.scroll').dual(); // call </script> </body> </html>
运行代码
Form:
jQuery动画高级用法(上)——详解animation中的.queue()函数
jQuery中queue和dequeue的用法
jQuery的deferred对象详解
(from:
狐狸
)
jquery api queue
查看全文
相关阅读:
学习《Building Applications with FME Objects》 之十 使用集合
oracle左右连接的另外表示方法
拥抱SQLAlchemy 之二 拉拉手,我请你去看电影~
Oracle中的Union、Union All、Intersect、Minus
System.Data.SQLite测试
SmartSVN + google code
学习《Building Applications with FME Objects》 之九 高级要素处理
Django静态文件配置备忘录
测试oracle with as
测量坐标系中单个多边形面积解析法计算的程序源代码
原文地址:https://www.cnblogs.com/jikey/p/2841401.html
最新文章
C#中 DataGridView 属性说明(转载)
依赖、关联、聚合、组合还有泛化的关系(转载)
读自定义应用程序配置文件2(app.config)转载
Web开发人员应当知道的15个开源项目(转载)
几个国外的开源社区
读自定义应用程序配置文件1(app.config)
通用异常处理框架(转载)
vs2005 突然点断点不能调试了,总结原因
大数据时代有感
实现自己的$.ajax
热门文章
web桌面
LDO使用之热阻考虑
关于OrCAD Capture CIS导网表出现问题的解决方法
FPGA调试小结
EMI之时钟设计
电容耐压选择
硬件调试经验小结
FPGA调试之配置芯片电压设置
Oracle 函数大全(字符串函数,数学函数,日期函数,逻辑运算函数,其他函数)
拥抱SQLAlchemy 之一 一见钟情
Copyright © 2011-2022 走看看