资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
jQuery 右下角滑动弹出可关闭重现层完整代码
效果图：
完整代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1.7.2%2Fjquery.min.js%22%3E%3C%2Fscript%3E"> <title>jquery右下角滑动弹出可关闭重现层 博客园 计划 教程</title> <meta name="keywords" content="www.glzy8.com"/> <style type="text/css"> *{ margin:0px; padding:0px;} #jihuaslide{ width:300px; height:200px; border:1px solid #000; position:fixed; bottom:2px; right:2px; display:none; background-color:White;} #jihuaslide a{ position:absolute; top:8px; right:8px; font-size:12px; text-decoration:none; color:Blue;} #jihuaslide 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;">管理资源吧</div> <div style="background-color:Red; width:100%;height:150px;">欢迎</div> <div style="background-color:Yellow; width:100%;height:150px;">hi</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;">glzy8.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;">A</div> <div style="background-color:Purple; width:100%;height:150px;">baidu.com</div> <div style="background-color:Green; width:100%;height:150px;">B</div> <div style="background-color:Lime; width:100%;height:150px;">hello</div> <div style="background-color:Orange; width:100%;height:150px;">Jihua</div> <div id="reshow">你快回来</div> <div id="jihuaslide"> <a href="javaScript:void(0)" _ewebeditor_ta_href="javaScript%3Avoid(0)" id="close">关闭</a> <span style=" line-height:50px;">右下角滑动弹出可重现层 www.glzy8.com</span> <h2>管理资源吧 jquery教程</h2> </div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0Afunction%20Jihua_Cnblogs_Com()%20%7B%20%24(%22%23jihuaslide%22).slideDown(%22slow%22)%3B%20%24(%22%23reshow%22).hide()%3B%20%7D%20%0D%0A%24(document).ready(function%20()%20%7B%20%0D%0AsetTimeout(function%20()%20%7B%20%0D%0AJihua_Cnblogs_Com()%3B%20%0D%0A%7D%2C%201000)%20%0D%0A%24(%22%23close%22).click(function%20()%20%7B%20%0D%0A%24(%22%23jihuaslide%22).slideUp(%22slow%22)%3B%20%24(%22%23reshow%22).show()%3B%20%0D%0A%7D)%20%0D%0A%24(%22%23reshow%22).mouseover(function%20()%20%7B%20%0D%0AJihua_Cnblogs_Com()%3B%20%2F%2Fwww.glzy8.com%20%0D%0A%7D)%20%0D%0A%7D)%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程
