Mr.J-- jQuery学习笔记(十五)--实现页面的对联广告

请看之前的：Mr.J-- jQuery学习笔记(十四)--动画显示隐藏

话不多说，直接上demo

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>对联广告</title><style>*{margin: 0;padding: 0;}.left{float: left;position: fixed;left: 0;top: 200px;}.right{float: right;position: fixed;right: 0;top: 200px;}img{display: none;}</style><script src="js/jquery-1.12.4.js"></script><script>$(function () {// 1.监听网页的滚动$(window).scroll(function () {// 1.1获取网页滚动的偏移位var offset = $("html,body").scrollTop();// 1.2判断网页是否滚动到了指定的位置if(offset >= 500){// 1.3显示广告$("img").show(1000);}else{// 1.4隐藏广告$("img").hide(1000);}});});</script>
</head>
<body>
<img src="data:images/left_ad.png" class="left">
<img src="data:images/right_ad.png" class="right">
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</body>
</html>

先放入照片，复制粘贴代码即可食用。

Mr.J-- jQuery学习笔记(十五)--实现页面的对联广告相关推荐

python复制指定字符串_python3.4学习笔记(十五) 字符串操作（string替换、删除、截取、复制、连接、比较、查找、包含、大小写转换、分割等）...
python3.4学习笔记(十五) 字符串操作(string替换.删除.截取.复制.连接.比较.查找.包含.大小写转换.分割等) python print 不换行(在后面加上,end=''),prin ...
windows内核开发学习笔记十五：IRP结构
windows内核开发学习笔记十五:IRP结构 IRP(I/O Request Package)在windows内核中,有一种系统组件--IRP,即输入输出请求包.当上层应用程序需要访问底层输入输 ...
Polyworks脚本开发学习笔记(十五)-用Python连接Polyworks的COM组件
Polyworks脚本开发学习笔记(十五)-用Python连接Polyworks的COM组件用Polyworks脚本开发,没有高级语言的支持,功能难免单一,一些比较复杂的交互实现不了,界面和报告也很 ...
IOS之学习笔记十五(协议和委托的使用)
1.协议和委托的使用 1).协议可以看下我的这篇博客 IOS之学习笔记十四(协议的定义和实现) https://blog.csdn.net/u011068702/article/details/809 ...
世界是有生命的（通向财富自由之路学习笔记十五）
最近因为工作调度的事情,有了一段空闲的日子,有比较多的时间来回望自己走过的路以及如何走好以后的路.之前忙得很少时间来写博文,很少时间来写读书笔记,逐渐将自己一些很好的习惯丢弃了.从今天起将重拾写博文的 ...
前端学习笔记(十五)
第十五章 HTML5新增标签一.HTML5概述 1.简介 HTML5万维网的核心语言.标准通用标记语言下的一个应用超文本标记语言的第五次大修改.HTML5将成为 HTML.XHTML ...
【theano-windows】学习笔记十五——受限玻尔兹曼机
前言终于到了最喜欢的模型: 受限玻尔兹曼机(RBM)了, 发现关于RBM是如何从能量模型发展过来的介绍非常不错, 而关于详细理论证明, 可以去看我前面的受限玻尔兹曼机的一系列博客. 国际惯例, 参考 ...
hough变换直线检测_CV学习笔记(十五):直线检测
在这一篇文章中我们将学习使用OpenCV中的 HoughLines 函数和 HoughLinesP 函数来检测图像中的直线. 在这个函数中,使用的是霍夫变换(Hough Transform) 这是计算 ...
jQuery学习笔记（五）
jQuery与Ajax的应用 Ajax的优势和不足 Ajax的优势 a)不需要插件支持 b)优秀的用户体验 c)提高Web程序的性能 d)减轻服务器和宽带的负担 Ajax的不足 a)浏览器对XMLH ...

Mr.J-- jQuery学习笔记(十五)--实现页面的对联广告

Mr.J-- jQuery学习笔记(十五)--实现页面的对联广告相关推荐

最新文章

热门文章