JQuery实现两侧浮动广告
1、描述
两侧浮动显示广告
2、要点
其实就是一直在变浮动广告距顶部的值。
3、代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{margin: 0;padding: 0;}
.left{
position: absolute;
left: 0;
top:80px;
}
.right{
position: absolute;
right:0;
top:80px;
}
p{
height: 10000000px; }
</style>
<script src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(function(){
$(window).scroll(function(){
var docHeight=$(document).scrollTop();
$(".left,.right").animate({"top":docHeight+80},30);
});
});
</script>
</head>
<body>
<div class="left">
<img src="img/1.gif"/>
</div>
<div class="right">
<img src="img/2.gif"/>
</div>
<p></p>
</body>
</html>
JQuery实现两侧浮动广告的更多相关文章
- web页面浮动回到顶部功能和浮动广告
实现测试浮动回到顶部 法一:用js实现<%@ Page Language="C#" AutoEventWireup="true" CodeBehind=& ...
- 笨办法用js屏蔽被http劫持的浮动广告
最近发现网站经常在右下角弹出一个浮动广告,开始的时候以为只是浏览器的广告. 后来越来越多同事反映在家里不同浏览器也会出现广告.然后深入检查了下,发现网站竟然被劫持了. 然后百度了一大堆资料,什么htt ...
- Js浮动广告效果实现
第一种 漂浮广告 不符合W3CJavaScript漂浮广告代码,很不错,代码精简,不过一次只有漂一个,复制就能用了.希望站长朋友喜欢. <html> <head> <ti ...
- JavaScript浮动广告代码，容纯DIV/CSS对联漂浮广告代码，兼容性非常好的js右下角与漂浮广告代码
基于JavaScript代码实现随机漂浮图片广告,javascript图片广告 在网上有很多这样的代码,不过未必符合W3C标准,因为在头部加上<!DOCTYPE html>类似标签之后,漂 ...
- jQuery防京东浮动网站楼层导航代码
jQuery防京东浮动网站楼层导航代码 <!DOCTYPE html > <html xmlns="http://www.w3.org/1999/xhtml" ...
- jQuery实现的浮动层div浏览器居中显示效果
本文实例讲述了jQuery实现的浮动层div浏览器居中显示效果.分享给大家供大家参考,具体如下: 1.在页面的head中引入jQuery <script type="text/java ...
- JS-特效 ～ 02. 屏幕滚动事件、 DTD、scroll、顶部悬浮导航、两侧跟随广告、返回顶部小火煎
ceil 向上取整 floor 向下取整 round 四舍五入 缓动动画 动画原理 = 盒子位置 + 步长 清除定时器 步长越来越小 盒子位置 = 盒子本身位置 + (目标位置-本身位置)/n(最好为 ...
- jQuery仿京东首页广告图片切换图片轮播
1.效果图如下: 2.源码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- 自己写的jQuery浮动广告插件
效果图: 文件位置摆放: 插件的js代码: $.extend({ pfAdv:function(options){ var defaults={ count:1, startTop:200, star ...
随机推荐
- Inno Setup入门（二十二）——Inno Setup类参考（8）
: Install Setup 2013-02-02 11:31 477人阅读 评论(0) 收藏 举报 列表框 列表框(ListBox)是Windows应用程序中重要的输入手段,其中包括多个选项用户可 ...
- 笨方法学python--打印
1 print 语句 尾端的逗号 end1 = "C" end2 = "h" end3 = "e" end4 = "e" ...
- ASP.NET网站限制访问频率
最近做了一个免费发短信的小网站(http://freesms.cloudapp.net/),但发现最近有人破解了我的验证码,以每3秒/条的速度用我的短信服务来发他的广告.更换验证码程序和过滤关键字只是 ...
- Spring 与 mybatis整合 Error parsing Mapper XML. Cause: java.lang.NullPointerException
mapper配置文件中的namespace没有填:而且namespase的值应该填为:mapper的权限定名:否则还是会抛出异常 org.springframework.beans.factory.B ...
- Java学习笔记之接口和抽象类
接口(interface)1.interface创建一个接口,implements实现接口 interface jiekou{} class lie implements jiekou{}2.接口可以 ...
- 转 Oracle DBCA高级玩法：从模板选择、脚本调用到多租户
但凡是学过Oracle的同学,对DBCA(Database Configuration Assistant, DBCA)都不会陌生,有了这个工具,使得创建数据库成为可能.而DBCA本身有图形和静默两种 ...
- 3d 人物残像
前言: gameunity 框架 还在继续完善中,0.2版本将会是一次 重大的里程碑. 正文: 哈哈,大家一定流汗了吧.请原谅我为自己代言. 好了,今天我要讲的是 3d人物残像. 首先我来说下 目前 ...
- HDU1233--还是畅通工程（最小生成树）
Problem Description 某省调查乡村交通状况,得到的统计表中列出了任意两村庄间的距离.省政府"畅通工程"的目标是使全省任何两个村庄间都可以实现公路交通(但不一定有直 ...
- Extjs视频
Extjs视频http://www.youku.com/playlist_show/id_19343298.html ExtJs视频教程(关东升) 智捷关东升老师ExtJs视频教程AJAX框架-Ext ...
- ormlite 删除操作
ormlite删除操作 DeleteBuilder<TransferDetailDtl, Integer> deleteBuilder = mRawDao.deleteBuilder(); ...