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 相关文章推荐
理解Javascript_12_执行模型浅析
Oct 18 Javascript
JavaScript定义类或函数的几种方式小结
Jan 09 Javascript
javascript仿qq界面的折叠菜单实现代码
Dec 12 Javascript
JavaScript调用ajax获取文本文件内容实现代码
Mar 28 Javascript
IE6浏览器中window.location.href无效的解决方法
Nov 20 Javascript
如何解决ligerUI布局时Center中的Tab高度大小
Nov 24 Javascript
AngularJS Bootstrap详细介绍及实例代码
Jul 28 Javascript
vue2.0父子组件间通信的实现方法
Apr 19 Javascript
详解AngularJs路由之Ui-router-resolve(预加载)
Jun 13 Javascript
express+mockjs实现模拟后台数据发送功能
Jan 07 Javascript
vue2.0 + ele的循环表单及验证字段方法
Sep 18 Javascript
JavaScript中filter的用法实例分析
Feb 27 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
德生PL550的电路分析
2021/03/02 无线电
分享PHP入门的学习方法
2007/01/02 PHP
PHP用mysql数据库存储session的代码
2010/03/05 PHP
jQuery UI AutoComplete 自动完成使用小记
2010/08/21 Javascript
javascript获得服务器端控件的ID的实现代码
2011/12/28 Javascript
js时间戳格式化成日期格式的多种方法
2013/11/11 Javascript
用正则表达式替换图片地址img标签
2013/11/22 Javascript
Javascript基础教程之break和continue语句
2015/01/18 Javascript
RequireJS多页面应用实例分析
2016/06/29 Javascript
详解堆的javascript实现方法
2016/11/29 Javascript
Vue-Router实现页面正在加载特效方法示例
2017/02/12 Javascript
JSON 数据格式详解
2017/09/13 Javascript
详细分析JS函数去抖和节流
2017/12/05 Javascript
Vue 项目分环境打包的方法示例
2018/08/03 Javascript
JSON基本语法及与JavaScript的异同实例分析
2019/01/04 Javascript
js实现一个简易计算器
2020/03/30 Javascript
Vue调用后端java接口的实例代码
2019/10/28 Javascript
Javascript中的this,bind和that使用实例
2019/12/05 Javascript
JS事件循环机制event loop宏任务微任务原理解析
2020/08/04 Javascript
解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题
2020/08/14 Javascript
Python CSV模块使用实例
2015/04/09 Python
python语言线程标准库threading.local解读总结
2019/11/10 Python
手把手教你用纯css3实现轮播图效果实例
2017/05/04 HTML / CSS
法国女性内衣购物网站:Glamuse
2019/05/13 全球购物
精选奢华:THE LIST
2019/09/05 全球购物
广州某公司软件工程师面试题
2014/12/22 面试题
财务与信息服务专业推荐信
2013/11/28 职场文书
机电工程学生自荐信范文
2013/12/07 职场文书
考试不及格检讨书
2014/01/09 职场文书
庆八一活动方案
2014/01/25 职场文书
学生逃课检讨书1000字
2014/10/20 职场文书
个人作风建设心得体会
2014/10/22 职场文书
文明班级申报材料
2014/12/24 职场文书
地道战观后感
2015/06/04 职场文书
军训通讯稿范文
2015/07/18 职场文书
上个世纪50年代的可穿戴技术:无线电帽子
2022/02/18 无线电