导入<script src="<%=path%>/html5/js/jquery.js"></script>文件

<SCRIPT type="text/javascript">

$(document).ready(function(){
  var menuYloc = $("#DIVFLOAT").offset().top;
  $(window).scroll(function (){
  var offsetTop = menuYloc + $(window).scrollTop() +"px";
  $("#DIVFLOAT").animate({top : offsetTop },{ duration:100 , queue:false });
  });
});

</SCRIPT>

<body>                                   <!--与top的距离-->
<div style="POSITION: absolute; top:50px ; left: 100px;background-color: white; width: 50px;padding-left: 60px" id="DIVFLOAT">
<table>

<c:forEach begin="1" end="4" step="1" var="i" >
<tr>
<td>DIV广告浮动效果</td>
<td>&nbsp;&nbsp;</td>
</tr>

</c:forEach>
</table>
</div>

<div style="float:left; top:40px;left:30px;background-color:white;width:100px;">
<c:forEach begin="1" end="200" step="1" var="i" varStatus="r" >
<table>
<tr>
<td>左边参照${i }==${r.index }==${r.count }</td>
</tr>
</table>
</c:forEach>
</div>
</body>

Jquery广告浮动效果小案例的更多相关文章

  1. Javascript 广告浮动效果在浏览器中间N秒后移动到右下角

    Javascript 广告浮动效果在浏览器中间N秒后移动到右下角 闲着无聊做了一个,本人原创...就是这个页面的广告效果....怎么样???? 刚刚学习的javascript

  2. 慕课网4-2 编程练习:jQuery祖先后代选择器小案例

    4-2 编程练习 结合所学的祖先后代选择器,实现如下图所示效果 任务 (1)使用祖先后代选择器将第二段文字背景色变成红色 (2)使用jQuery的.css()方法设置样式,语法css('属性 '属性值 ...

  3. JS--中奖广告浮动效果

    618要到了.要帮公司做一个简单的中奖号码的浮动.怎么玩了.其实只需要使用scrollHeight;scrollTop;offsetHeight这三个就可以实现了. 代码如下: <html> ...

  4. jQuery的DOM操作小案例

    案例一:下拉列表左右选择 <body> <div> <select style="width:60px" multiple size="10 ...

  5. [jQuery学习系列六]6-jQuery实际操作小案例

    前言最后在这里po上jQuery的几个小案例. Jquery例子1_占位符使用需求: 点击第一个按钮后 自动去check 后面是否有按钮没有选中, 如有则提示错误消息. <html> &l ...

  6. jquery mobile小案例

    ---恢复内容开始--- [jquery mobile小案例]效果图如下: 首先先创建一个页面主要使用data-role="page"这个指令,我们给它起个id="pag ...

  7. VUE小案例--跑马灯效果

    自学Vue课程中学到的一个小案例,跑马灯效果 <!DOCTYPE html> <html lang="zh-CN"> <head> <me ...

  8. 非常强大的jQuery万能浮动框插件

    支持hover, click, focus以及无事件触发:支持多达12种位置的定位,出界自动调整:支持页面元素加载,Ajax加载,下拉列表,提示层效果,tip类效果等:可自定义装载容器:内置UI不错的 ...

  9. jQuery实现放大镜效果

    1.1.1 摘要 相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果. 在接下来的博文中,我们将向 ...

随机推荐

  1. LoadRunner 脚本学习 -- 使用动态链接库

    DLL = Dynamic Link Library DLL最重要的一个特点就扩展应用程序的特性. 再强大的工具也有不是万能的,通过调用动态库的方法极大地增强loadrunner的功能.当你在用loa ...

  2. winform里怎样在一个按钮上实现“单击”和“双击”事件?

    Button按钮是没有双击事件(DoubleClick)的. button1.DoubleClick+=new EventHandler(button1_DoubleClick);使用这种方法在双击的 ...

  3. DuckHunter Attacks

    DuckHunter Attacks   DuckHunter Attacks是从USB Rubber Ducky (USB橡皮鸭)发展过来的HID攻击方式.USB Rubber Ducky是从201 ...

  4. 【CRL in c#】常量与字段

    1.常量(constant) 1,  常量是一个从不变化的值.只有在确定一个符号的值从不变化时使用. 2,  只能为基元类型定义常量(Boolean,Char,Byte,Int32……),非基元类型定 ...

  5. Visual Studio 设置 Inherited include Directories

    在用Visual Studio进行开发的时候,避免不了要使用一些常用的第三方提供的库.如果是一次两次设置还能让人忍受,但是如果要写很多项目的话,设置这些库真的很让人头疼.不过Visual Studio ...

  6. 读书笔记和sprint总结

    第八章  需求分析 主要是讲需求的分析,对于一个程序项目来说,我觉得,需求是这个项目的向导,他可以决定程序项目会发展成什么样子.书里面需求这里大致分为两个:软件需求和用户需求. 软件需求:我们不仅仅要 ...

  7. 最近点对问题 POJ 3714 Raid && HDOJ 1007 Quoit Design

    题意:有n个点,问其中某一对点的距离最小是多少 分析:分治法解决问题:先按照x坐标排序,求解(left, mid)和(mid+1, right)范围的最小值,然后类似区间合并,分离mid左右的点也求最 ...

  8. HDU5855 Less Time, More profit(最大权闭合子图)

    题目 Source http://acm.hdu.edu.cn/showproblem.php?pid=5855 Description The city planners plan to build ...

  9. node.js--HTTP模块

    HTTP模块 node.js提供了一个创建自己服务器的方式,用起来很简单,首先引用http模块 //引用HTTP模板 var http = require('http'); 创建服务实例:http.c ...

  10. [转载]DW数据仓库建模与ETL的实践技巧

    一.Data仓库的架构 Data仓库(Data Warehouse DW)是为了便于多维分析和多角度展现而将Data按特定的模式进行存储所建立起来的关系型Datcbase,它的Data基于OLTP源S ...