jQuery实现的右下角广告窗体跟随效果示例


Posted in Javascript onSeptember 16, 2016

本文实例讲述了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>
  <title></title>
  <style type="text/css">
    body{margin:0px;font-size:12px;}
    #message
    {
      width:100px;
      height:100px;
      position:fixed;
      background-color:gold;
      right:0px;
      bottom:0px;
      display:none;
    }
  </style>
  <script src="../js/jquery-1.5.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      //注意slideDown是展开,slideUp是收起
      $("#message").slideDown(2000, function () {
        //$(this).slideUp(5000);   //花5秒钟收起
        setTimeout("$('#message').slideUp(5000);",2000)   //用定时器等待两秒钟后收起,注意这里不能用$(this),必须用ID取了
      });
    });
  </script>
</head>
<body>
  <div id="message">
    我是广告,不好意思!!
  </div>
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
WebGame《逆转裁判》完整版 代码下载(1月24日更新)
Jan 29 Javascript
fancybox1.3.1 基于Jquery的插件在IE中图片显示问题
Oct 01 Javascript
javascript实现继承的简单实例
Jul 26 Javascript
JavaScript小技巧整理篇(非常全)
Jan 26 Javascript
JS设置cookie、读取cookie
Feb 24 Javascript
AngularJS基础 ng-submit 指令简单示例
Aug 03 Javascript
js 输入框 正则表达式(菜鸟必看教程)
Feb 19 Javascript
完美解决axios跨域请求出错的问题
Feb 05 Javascript
如何使用Node.js爬取任意网页资源并输出PDF文件到本地
Jun 17 Javascript
node.js 如何监视文件变化
Sep 01 Javascript
实现vuex原理的示例
Oct 21 Javascript
如何在JavaScript中等分数组的实现
Dec 13 Javascript
jQuery实现磁力图片跟随效果完整示例
Sep 16 #Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
Sep 16 #Javascript
jQuery中fadein与fadeout方法用法示例
Sep 16 #Javascript
jQuery中slidedown与slideup方法用法示例
Sep 16 #Javascript
jQuery中show与hide方法用法示例
Sep 16 #Javascript
Javascript中函数名.length属性用法分析(对比arguments.length)
Sep 16 #Javascript
Javascript函数中的arguments.callee用法实例分析
Sep 16 #Javascript
You might like
example2.php
2006/10/09 PHP
php报表之jpgraph柱状图实例代码
2011/08/22 PHP
PHP Class&amp;Object -- 解析PHP实现二叉树
2013/06/25 PHP
yii,CI,yaf框架+smarty模板使用方法
2015/12/29 PHP
用javascript做拖动布局的思路
2008/05/31 Javascript
div移动 输入框不能输入的问题
2009/11/19 Javascript
JS声明变量背后的编译原理剖析
2012/12/28 Javascript
为Javascript中的String对象添加去除左右空格的方法(示例代码)
2013/11/30 Javascript
jquery 鼠标滑动显示详情应用示例
2014/01/24 Javascript
jquery ajax分页插件的简单实现
2016/01/27 Javascript
Vuex模块化实现待办事项的状态管理
2017/03/15 Javascript
AngularJS 打开新的标签页实现代码
2017/09/07 Javascript
移动端 Vue+Vant 的Uploader 实现上传、压缩、旋转图片功能
2019/06/10 Javascript
javascript实现5秒倒计时并跳转功能
2019/06/20 Javascript
基于 vue-skeleton-webpack-plugin 的骨架屏实战
2019/08/05 Javascript
Vue组件模板及组件互相引用代码实例
2020/03/11 Javascript
解决vue+elementui项目打包后样式变化问题
2020/08/03 Javascript
在Python的框架中为MySQL实现restful接口的教程
2015/04/08 Python
举例详解Python中循环语句的嵌套使用
2015/05/14 Python
python脚本监控docker容器
2016/04/27 Python
Python计算两个日期相差天数的方法示例
2017/05/23 Python
Python3之读取连接过的网络并定位的方法
2018/04/22 Python
Python 实现删除某路径下文件及文件夹的实例讲解
2018/04/24 Python
数据清洗--DataFrame中的空值处理方法
2018/07/03 Python
Python中的random.uniform()函数教程与实例解析
2019/03/02 Python
Django Serializer HiddenField隐藏字段实例
2020/03/31 Python
Python字典取键、值对的方法步骤
2020/09/30 Python
Python结合百度语音识别实现实时翻译软件的实现
2021/01/18 Python
Rowdy Gentleman服装和配饰:美好时光
2019/09/24 全球购物
Street One瑞士:德国现代时装公司
2019/10/09 全球购物
UDP协议功能
2013/01/06 面试题
大学生毕业自我鉴定
2013/11/06 职场文书
大学生评语大全
2014/04/18 职场文书
解决Jupyter-notebook不弹出默认浏览器的问题
2021/03/30 Python
python运行脚本文件的三种方法实例
2022/06/25 Python
关于对TypeScript泛型参数的默认值理解
2022/07/15 Javascript