jquery定时滑出可最小化的底部提示层特效代码


Posted in Javascript onOctober 02, 2013

html源代码:

<!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" />
<title>jquery定时滑出可最小化的底部提示层</title><base target="_blank" />
<link href="https://3water.com/phtml/jqtexiao/index/style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="https://3water.com/pmedia/jquery/jquery-1.10.2.min.js"></script>
</head>
<body>
<div style="width:800px;margin:0px auto">
<span style="font-size:18px; font-weight:bold; text-align:center; line-height:25px; color:#000; width:100%">jquery定时底部滑出可最小化的提示层特效<br />
<a href="https://3water.com" target="_blank" style="color:#000">三水点靠木</a>(<a href="https://3water.com" style="color:#000" target="_blank">https://3water.com</a>)<br />
<br />
</span>
当打开页面或者刷新页面后等待两秒钟,会在底部滑出可最小化的提示层。
</div>
<div style="background-color:Red; width:100%;height:150px;">欢迎。</div>
<div style="height:830px;"></div>
<div style="background-color:Fuchsia; width:100%;height:150px;">3water</div>
<div style="height:500px;"></div>
<div class="bottom_box-keleyi-com">
<div class="bottom">
<p>感谢您访问三水点靠木网站!<a href="https://3water.com" target="_blank">https://3water.com</a>,<br/>专门分享实用、常用的技术文章代码资源的网站</p>
<div class="ask"><a href="https://3water.com/">首页</a>
<a href="https://3water.com/ablut/">关于</a>
<a href="https://3water.com/a/bjac/kjsrt3b0.htm">jQuery AJAX</a>
<a href="https://3water.com/a/bjac/182di68b.htm">导航样式</a>
<a href="https://3water.com/a/bjac/mt97p5y9.htm">侧边导航</a>
<a href="https://3water.com/dev/3068696139522ae4.htm">树形菜单</a>
<a href="https://3water.com/game/1/">捕鱼</a>
<a href="https://3water.com/game/3/">打地鼠</a>
<a href="https://3water.com/game/4/">美女拼图</a>
<a href="https://3water.com/phtml/silverlight/">猜数字</a>
</div>
</div>
<div class="close"></div> 
</div>
<img class="mini" src="https://3water.com/phtml/jqtexiao/index/mini.png" width="65" height="37" alt="打开" />
<script type="text/javascript">
$(function(){
setTimeout(function(){
$(".bottom_box-k"+"eleyi-com").slideDown("slow");
},2000);
$(".close").click(function(){
$(".bottom_box-ke"+"leyi-com").hide();    
$(".mini").show(200);    
})
$(".mini").click(function(){
$(this).hide();    
$(".bottom_box-kele"+"yi-com").show();    
})
});
</script>
</body>
</html>
Javascript 相关文章推荐
js遍历td tr等html元素
Dec 13 Javascript
JavaScript 实现打印,打印预览,打印设置
Dec 30 Javascript
jQuery插件animateSlide制作多点滑动幻灯片
Jun 11 Javascript
JavaScript缓冲运动实现方法(2则示例)
Jan 08 Javascript
jQuery 获取跨域XML(RSS)数据的相关总结分析
May 18 Javascript
jQuery实现按钮点击遮罩加载及处理完后恢复的效果
Jun 07 Javascript
详解React开发中使用require.ensure()按需加载ES6组件
May 12 Javascript
JS小球抛物线轨迹运动的两种实现方法详解
Dec 20 Javascript
webpack热模块替换(HMR)/热更新的方法
Apr 05 Javascript
Vue render渲染时间戳转时间,时间转时间戳及渲染进度条效果
Jul 27 Javascript
详解vue父子组件关于模态框状态的绑定方案
Jun 05 Javascript
详解Nuxt.js中使用Element-UI填坑
Sep 06 Javascript
jquery实现多级下拉菜单的实例代码
Oct 02 #Javascript
基于JQuery的列表拖动排序实现代码
Oct 01 #Javascript
Javascript 颜色渐变效果的实现代码
Oct 01 #Javascript
JavaScript的事件绑定(方便不支持js的时候)
Oct 01 #Javascript
javascript不可用的问题探究
Oct 01 #Javascript
JavaScript DOM 编程艺术(第2版)读书笔记(JavaScript的最佳实践)
Oct 01 #Javascript
js有序数组的连接问题
Oct 01 #Javascript
You might like
用PHP ob_start()控制浏览器cache、生成html实现代码
2010/02/16 PHP
PHP判断数据库中的记录是否存在的方法
2014/11/14 PHP
php操作mongoDB实例分析
2014/12/29 PHP
PHP 网站修改默认访问文件的nginx配置
2017/05/27 PHP
laravel-admin 管理平台获取当前登陆用户信息的例子
2019/10/08 PHP
含有CKEditor的表单如何提交
2014/01/09 Javascript
jQuery中andSelf()方法用法实例
2015/01/08 Javascript
JavaScript 异常处理 详解
2015/02/06 Javascript
js实现的牛顿摆效果
2015/03/31 Javascript
javascript实现右侧弹出“分享到”窗口效果
2016/02/01 Javascript
一道常被人轻视的web前端常见面试题(JS)
2016/02/15 Javascript
nodeJs爬虫获取数据简单实现代码
2016/03/29 NodeJs
jQuery插件HighCharts实现2D柱状图、折线图的组合多轴图效果示例【附demo源码下载】
2017/03/09 Javascript
js删除数组中的元素delete和splice的区别详解
2018/02/03 Javascript
详解各版本React路由的跳转的方法
2018/05/10 Javascript
解决layui 复选框等内置控件不显示的问题
2018/08/14 Javascript
vue添加axios,并且指定baseurl的方法
2018/09/19 Javascript
Vue数据绑定简析小结
2019/05/07 Javascript
turn.js异步加载实现翻书效果
2019/07/25 Javascript
[01:27]DOTA2电竞之夜 今夜共饮庆功酒
2014/08/02 DOTA
[02:44]完美大师赛主赛事淘汰赛第二日观众采访
2017/11/24 DOTA
Python基础学习之类与实例基本用法与注意事项详解
2019/06/17 Python
解决os.path.isdir() 判断文件夹却返回false的问题
2019/11/29 Python
Python实现封装打包自己写的代码,被python import
2020/07/12 Python
详解python tkinter包获取本地绝对路径(以获取图片并展示)
2020/09/04 Python
Python实现Word文档转换Markdown的示例
2020/12/22 Python
俄罗斯旅游网站:Tripadvisor俄罗斯
2017/03/21 全球购物
应届生如何写自荐信
2014/01/05 职场文书
新三好学生主要事迹
2014/01/23 职场文书
毕业生就业推荐表自我鉴定
2014/03/20 职场文书
员工激励培训演讲稿
2014/09/16 职场文书
审计局班子四风对照检查材料思想汇报
2014/10/07 职场文书
初中重阳节活动总结
2015/05/05 职场文书
费城故事观后感
2015/06/10 职场文书
邓小平文选读书笔记
2015/06/29 职场文书
pytorch 梯度NAN异常值的解决方案
2021/06/05 Python