jquery右下角自动弹出关闭层
2015-04-02 17:37
465 查看
效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/36.htm
右下角弹出层后,会在一定时间后自动隐藏。第一版本:/article/4797558.html
html代码:
前端资源:/article/4797642.html
右下角弹出层后,会在一定时间后自动隐藏。第一版本:/article/4797558.html
html代码:
<!DOCTYPE HTML> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="UTF-8"> <title>jquery右下角自动弹出关闭层-柯乐义</title><base target="_blank"/> <meta name="keywords" content="keleyi.com" /> <script type="text/javascript" src="http://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.2.min.js"></script> <style type="text/css"> * { margin: 0px; padding: 0px; } a {color:black; } #keleyislide { width: 300px; height: 200px; border: 1px solid #000; position: fixed; bottom: 2px; right: 2px; display: none; background-color: White; z-index:9999; } #keleyislide a { position: absolute; top: 8px; right: 8px; font-size: 12px; text-decoration: none; color: Blue; } #keleyislide h2 { font-size: 24px; text-align: center; font-family: "微软雅黑"; } #reshow { position: fixed; right: 2px; bottom: 2px; font-size: 12px; display: none; background-color: White; cursor: pointer; border: 1px solid #000; } </style> </head> <body> <div style="background-color:Green; width:100%;height:150px;">keleyi.com</div> <div style="background-color:Red; width:100%;height:150px;">欢迎</div> <div style="background-color:Yellow; width:100%;height:150px;"><a href="http://keleyi.com/a/bjae/t5t54xly.htm">原文</a> <a href="http://keleyi.com">首页</a> <a href="http://keleyi.com/keleyi/phtml/">特效库</a> <a href="http://hovertree.com">HoverTree</a> 一定时间后弹出层会自动隐藏 </div> <div style="background-color:Silver; width:100%;height:150px;">计划</div> <div style="background-color:Aqua; width:100%;height:150px;">柯乐义</div> <div style="background-color:Fuchsia; width:100%;height:150px;">jihua</div> <div style="background-color:Green; width:100%;height:150px;">hovertree.com</div> <div style="background-color:Blue; width:100%;height:150px;">cnblogs</div> <div style="background-color:Olive; width:100%;height:150px;">欢迎光临</div> <div style="background-color:Green; width:100%;height:150px;">randomvisit</div> <div style="background-color:Purple; width:100%;height:150px;">jihua.cnblogs.com</div> <div style="background-color:Green; width:100%;height:150px;">B</div> <div style="background-color:Lime; width:100%;height:150px;">myslider</div> <div style="background-color:Orange; width:100%;height:150px;">Jihua</div> <div id="reshow">你快回来</div> <div id="keleyislide"> <a href="javaScript:void(0)" id="close" target="_self">关闭</a> <span style=" line-height:50px;">右下角滑动弹出可重现层<br />keleyi.com</span> <h2>柯乐义 教程</h2> </div> <script type="text/javascript"> function Jihua_Cnblogs_Com() { $("#kel"+"eyislide").slideDown("slow"); $("#reshow").hide(); } function KeleyiAutoHide() { $("#ke"+"leyislide").slideUp("slow"); $("#reshow").show(); } $(document).ready(function () { setTimeout(function () { Jihua_Cnblogs_Com(); }, 1000) setTimeout(function () { KeleyiAutoHide(); },9000) $("#close").click(function () { KeleyiAutoHide(); }) $("#reshow").mouseover(function () { Jihua_Cnblogs_Com(); //keleyi.com }) }) </script> </body> </html>
前端资源:/article/4797642.html
相关文章推荐
- jquery 信息弹出后自动关闭
- jquery右下角自动弹出可关闭的广告层
- jQuery弹出Div窗口居中显示、滚动跟随、关闭按钮以及几秒后自动消失
- jquery右下角自动弹出可关闭的广告层
- jquery 弹出提示div 等待2秒自动关闭
- jQuery 弹出窗口2秒后自动关闭
- 基于Jquery的仿Windows Aero弹出窗(漂亮的关闭按钮)
- 为jquery.ui.dialog 增加“自动记住关闭时的位置”的功能
- 完美仿MSN右下角弹出广告代码并可自动消失,附带关闭按钮
- 消息框,自动弹出及关闭
- 点击对象弹出DIV层菜单可以定时自动关闭
- 动手写Jquery之--自动关闭的层
- 为jquery.ui.dialog 增加“自动记住关闭时的位置”的功能。
- 求高手指教,我有一个会员登陆文件页面,我想在会员点登陆弹出新窗口,然后自动关闭登陆窗口,就象腾讯2007版的官方会员网站http://my.qq.com上面的那个登陆窗口一样
- jquery-easyui关闭tab自动切换到前一个tab
- 自动关闭webBrowser弹出的所有窗口
- CSS+JS实现点击文字弹出定时自动关闭的DIV层菜单
- NoAds 2006.07.28(可以自动关闭网页浏览时弹出的广告小视窗)zkacb汉化版
- 如何在关闭窗口的时候,不让浏览器自动弹出确认关闭对话框
- 定时自动关闭弹出窗口