导入<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. c语言的字符串操作（比较详细）

    1)字符串操作 strcpy(p, p1) 复制字符串 strncpy(p, p1, n) 复制指定长度字符串 strcat(p, p1) 附加字符串 strncat(p, p1, n) 附加指定长度 ...

  2. 为什么要使用 Node.js

    这是一个移动端工程师涉足前端和后端开发的学习笔记,如有错误或理解不到位的地方,万望指正. Node.js 是什么 传统意义上的 JavaScript 运行在浏览器上,这是因为浏览器内核实际上分为两个部 ...

  3. Javascript 学习之路：鼠标长按事件

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  4. 课堂随笔 set （集合)

    1.什么是集合:set   (集合)为无序不重复的序列. 2.如何创建一个集合:(1)set()  这样就创建了一个空的集合(2)s1={11,22,33}这样也创建了一个集合.(3)s2=set([ ...

  5. DSP using MATLAB 示例 Example3.12

    用到的性质 代码: n = -5:10; x = sin(pi*n/2); k = -100:100; w = (pi/100)*k; % freqency between -pi and +pi , ...

  6. static方法中为什么使用的都是静态变量

    static方法中需要使用静态变量.假设其他类要使用该方法,该方法里面所使用的变量是非静态的,如果该方法所在的类没有实例化,会导致该方法里面的变量不能实例化,自然该static 方法不能使用

  7. SQL: enable sa Account in SQL Server

    Link: http://sudeeptaganguly.wordpress.com/2010/04/20/how-to-enable-sa-account-in-sql-server/ 引用: Wh ...

  8. H

    很爽的一局,打了70分钟,还刷新了我的最高击杀记录.打完出来一看居然是H局,第一次在H局里打出不错的表现诶.好像找人说一说,可惜并没有谁听,以前的朋友也不在了,还是算了,自己心里慢慢发霉去吧. 这局末 ...

  9. Activiti工作流学习（二）流程实例、执行对象、任务

    一.前言 前面说明了基本的流程部署.定义,启动流程实例等基本操作,下面我们继续来学习流程实例.执行对象.任务. 二.流程实例.执行对象说明 整个Activiti的生命周期经过了如下的几个步骤: 1.流 ...

  10. gulp plugins 插件介绍

    目录 [−] gulp API gulp.src(globs[, options]) gulp.dest(path[, options]) gulp.task(name[, deps], fn) gu ...