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实现两侧浮动广告的更多相关文章

  1. web页面浮动回到顶部功能和浮动广告

    实现测试浮动回到顶部 法一:用js实现<%@ Page Language="C#" AutoEventWireup="true" CodeBehind=& ...

  2. 笨办法用js屏蔽被http劫持的浮动广告

    最近发现网站经常在右下角弹出一个浮动广告,开始的时候以为只是浏览器的广告. 后来越来越多同事反映在家里不同浏览器也会出现广告.然后深入检查了下,发现网站竟然被劫持了. 然后百度了一大堆资料,什么htt ...

  3. Js浮动广告效果实现

    第一种 漂浮广告 不符合W3CJavaScript漂浮广告代码,很不错,代码精简,不过一次只有漂一个,复制就能用了.希望站长朋友喜欢. <html> <head> <ti ...

  4. JavaScript浮动广告代码，容纯DIV/CSS对联漂浮广告代码，兼容性非常好的js右下角与漂浮广告代码

    基于JavaScript代码实现随机漂浮图片广告,javascript图片广告 在网上有很多这样的代码,不过未必符合W3C标准,因为在头部加上<!DOCTYPE html>类似标签之后,漂 ...

  5. jQuery防京东浮动网站楼层导航代码

    jQuery防京东浮动网站楼层导航代码   <!DOCTYPE html > <html xmlns="http://www.w3.org/1999/xhtml" ...

  6. jQuery实现的浮动层div浏览器居中显示效果

    本文实例讲述了jQuery实现的浮动层div浏览器居中显示效果.分享给大家供大家参考,具体如下: 1.在页面的head中引入jQuery <script type="text/java ...

  7. JS-特效 ～ 02. 屏幕滚动事件、 DTD、scroll、顶部悬浮导航、两侧跟随广告、返回顶部小火煎

    ceil 向上取整 floor 向下取整 round 四舍五入 缓动动画 动画原理 = 盒子位置 + 步长 清除定时器 步长越来越小 盒子位置 = 盒子本身位置 + (目标位置-本身位置)/n(最好为 ...

  8. jQuery仿京东首页广告图片切换图片轮播

    1.效果图如下: 2.源码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  9. 自己写的jQuery浮动广告插件

    效果图: 文件位置摆放: 插件的js代码: $.extend({ pfAdv:function(options){ var defaults={ count:1, startTop:200, star ...

随机推荐

  1. dns是什么

    域名解析服务器,靠它把你要访问的网址找到然后把信息送到你电脑上.DNS 是域名系统 (Domain Name System) 的缩写,它是由解析器和域名服务器组成的.域名服务器是指保存有该网络中所有主 ...

  2. VMware设置NAT网络

    很多初学者迷茫与如何实现虚拟机VMware与主机互联,这里小编介绍下简单实用的NAT网络. 工具/原料   VMware 方法/步骤   打开VMware,选择  编辑, 虚拟网络编辑器 默认情况下, ...

  3. DataGirdView 编辑项时的验证

    dgvConfig.DataSource = CreateTable(); dgvConfig.Columns["编号"].ReadOnly = true; //只读 dgvCon ...

  4. ASP之Eval、Execute、ExecuteGlobal区别分析

    Eval.Execute.ExecuteGlobal 这三个语句(函数)都是执行字符串表达式,不过它们之间又有所不同. Eval 计算一个表达式的值并返回结果. 语法:[result = ]eval( ...

  5. 准备着手学习python

    1. python 的框架 Tornado 网址: http://www.tornadoweb.org/en/stable/ github: https://github.com/tornadoweb ...

  6. 转 dos 下的 find 和 重定向

    1.find /i "ora-" *.* > check.log 附录: 我对findstr是如此的依赖,以至于当我向各位讲解find命令的时候,我还得老老实实地在cmd窗口 ...

  7. JS day01——window对象、执行顺序、线程模型

    1.window对象 window对象表示当前浏览器的窗口,它是一个顶级对象,我们创建的所有对象.函数.变量都是window对象的成员. window对象自带了一些非常有用的方法.属性. window ...

  8. 【转】从1到N这N个数中1的出现了多少次？

    给定一个十进制整数N,求出从1到N的所有整数中出现"1"的个数. 例如:N=2,1,2出现了1个"1". N=12,1,2,3,4,5,6,7,8,9,10,1 ...

  9. Java的引用c++的引用和C指针的区别

    Java的引用本质上就是C中的指针,而c++的引用则完全不同:有一个类 class Point { int x; int y;} 同样的一个Point p; 在Java中p表示一个引用,它等同于C语言 ...

  10. A convenient way of installing(compiling) VIM with YCM

    Ah, while I am still downloading LLVM from github(very slow.. and very large in size). I come with m ...