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获取scrollHeight问题想到的标准问题
May 27 Javascript
Mootools 1.2教程 Fx.Morph、Fx选项和Fx事件
Sep 15 Javascript
根据邮箱的域名跳转到相应的登录页面的代码
Feb 27 Javascript
jquery原创弹出层折叠效果点击折叠弹出一个层
Mar 12 Javascript
JQuery validate插件Remote用法大全
May 15 Javascript
js获取Html元素的实际宽度高度的方法
May 19 Javascript
Jquery组件easyUi实现表单验证示例
Aug 23 Javascript
学习vue.js条件渲染
Dec 03 Javascript
EasyUI折叠表格层次显示detailview详解及实例
Dec 28 Javascript
vue添加class样式实例讲解
Feb 12 Javascript
js获取 gif 的帧数的代码实例
Sep 10 Javascript
小谈angular ng deploy的实现
Apr 07 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编写PDF文档生成器
2006/10/09 PHP
php小型企业库存管理系统的设计与实现代码
2011/05/16 PHP
PHP之短标签开启设置
2013/06/17 PHP
php使用pdo连接并查询sql数据库的方法
2014/12/24 PHP
php实现格式化多行文本为Js可用格式
2015/04/15 PHP
Yii2.0预定义的别名功能小结
2016/07/04 PHP
flash 得到自身url参数的代码
2009/11/15 Javascript
jquery实现炫酷的叠加层自动切换特效
2015/02/01 Javascript
jquery实现上下左右滑动的方法
2015/02/09 Javascript
jQuery中animate动画第二次点击事件没反应
2015/05/07 Javascript
JavaScript使用FileSystemObject对象写入文本文件内容的方法
2015/08/05 Javascript
jquery小火箭返回顶部代码分享
2015/08/19 Javascript
jquery if条件语句的写法
2016/05/19 Javascript
JS实现HTML标签转义及反转义
2020/04/14 Javascript
浅谈键盘上回车按钮的js触发事件
2017/02/13 Javascript
微信小程序实现瀑布流布局与无限加载的方法详解
2017/05/12 Javascript
用js屏蔽被http劫持的浮动广告实现方法
2017/08/10 Javascript
js删除数组中的元素delete和splice的区别详解
2018/02/03 Javascript
vue项目国际化vue-i18n的安装使用教程
2018/03/14 Javascript
Vue.js单向绑定和双向绑定实例分析
2018/08/14 Javascript
vue实现动态列表点击各行换色的方法
2018/09/13 Javascript
浅谈Vue SSR中的Bundle的具有使用
2019/11/21 Javascript
[01:06]DOTA2隆重推出2016冬季勇士令状 内含上海特级锦标赛互动指南
2016/02/17 DOTA
[35:39]完美世界DOTA2联赛PWL S2 FTD.C vs Rebirth 第二场 11.22
2020/11/24 DOTA
详解Python中内置的NotImplemented类型的用法
2015/03/31 Python
解决pandas 作图无法显示中文的问题
2018/05/24 Python
Python zip函数打包元素实例解析
2019/12/11 Python
以SQLite和PySqlite为例来学习Python DB API
2020/02/05 Python
python编写一个会算账的脚本的示例代码
2020/06/02 Python
css3+伪元素实现鼠标移入时下划线向两边展开的效果
2017/04/25 HTML / CSS
打造高效课堂实施方案
2014/03/22 职场文书
安全环保标语
2014/06/09 职场文书
婚内分居协议书范文
2014/11/26 职场文书
小区保洁员岗位职责
2015/04/10 职场文书
大学生就业指导课心得体会
2016/01/15 职场文书
100句人生哲理语录集锦:强者征服今天,懒汉坐等明天
2019/10/18 职场文书