元素随着滚动条滚动而滚动,但是到浏览器窗口顶部的距离是固定的功能代码

<html xmlns="http://www.w3.org/1999/xhtml"> <head>     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />     <title>jquery浮动层</title>     <script src="jquery-1.8.3.js"></script><!-- 注意修改引用路径 -->    <style type="text/css">           #Float {height: 200px;width: 100px;position: absolute;top:    80px;right: 20px;}      </style> </head> <script language="javascript">   $(document).ready(function(){       $(window).scroll(function (){                 // 让浮动层距离窗口顶部,始终保持80px           var offsetTop = $(window).scrollTop() + 80 +"px";                        $("#Float").animate({top : offsetTop },{ duration:500 , queue:false });      });  });</script> <body> <div style="height:2000px;"></div> <div id="Float"></div> </body> </html> 
时间: 2024-08-29 11:45:54

元素随着滚动条滚动而滚动,但是到浏览器窗口顶部的距离是固定的功能代码的相关文章

设置DIV随滚动条滚动而滚动

有段时间没有碰Web端了,最近做了个功能,需要做个DIV随滚动条滚动而滚动,mark一下: 源码: 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml&quo

js控制网页滚动条往下滚动

function aa(i){ var tm = setInterval(function(){ var t = $(window).scrollTop(); var d = i < t ? Math.min((i-t)/10, -1) : Math.max((i-t)/10, 1) $(window).scrollTop( t + d ); if($(window).scrollTop()==i)clearInterval(tm); },30) } js控制网页滚动条往下滚动

横向滚动条 根据滚轮滚动而移动 制作 与 问题处理

今天做一个项目的时候要用到 ‘横向滚动条 根据滚轮滚动而移动’ 上网上查了很多资料 还找了一些插件 !  都不是很好用 然后自己大概查了下资料 找到一个大概比较靠谱的 HTML <div style="width: 5000px;">test</div> jQuery $(function() { // 设置每次滚动长度,单位 px var scroll_width = 100; var scroll_events = "mousewheel DOMM

UIWebView隐藏右侧和底部滚动条,去掉滚动边界的黑色背景,禁止左右滑动

UIWebView隐藏右侧和底部滚动条,去掉滚动边界的黑色背景,禁止左右滑动, -(void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error方法中实现下面的方法: for (UIView *_aView in [m_webView subviews]) { if ([_aView isKindOfClass:[UIScrollView class]]) { [(UIScrollView *)_aView set

监听页面滚动及滚动到指定位置

两种监听页面滚动的方法 一.原生js通过window.onscroll监听window.onscroll = function() {//为了保证兼容性,这里取两个值,哪个有值取哪一个//scrollTop就是触发滚轮事件时滚轮的高度var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;console.log("滚动距离" + scrollTop);} 二.Jquery通过$(wind

(转)JS浮动窗口(随浏览器滚动而滚动)

原文:http://hi.baidu.com/aiyayaztt/item/4201c55a6b729dced2e10c79 JS浮动窗口(随浏览器滚动而滚动) 往往用于一些联系方式,互动平台模块,随着浏览器的滚动而滚动. <div id="AdLayer"> <p>窗口中的内容</p> </div> 放在<body>下面(页面最上面) JS代码 window.onload=function(){ var n=0;//top值

开发路程(14):背景图片移动插件MyFloatingBg(浮动背景图效果,可让背景随着页面的滚动而滚动)

MyFloatingBg这插件可以帮助你在网页上加入可移动背景Background.你可以用于整个文件的背景,或是某几个banner的背景. 它可支持简单的animation效果,你不用去做一个flash文件或动态gif图片.单靠jquery和图片,你便可以做出不同的效果.由于我们把动画效果跟内容分开,我们也可以随时更改文字等内容,而不影响其运作.这个效果很是大气,我想可以使用在高级餐厅,珠宝展会等中做展示用. 1 <!doctype html> 2 <html lang="e

flowLayoutPanel1设置内容随着鼠标滚动而滚动

当flowLayoutPanel1内容过多时,可以设置竖条,当时当鼠标滚动时,里面的内容不会随着鼠标的滚动而滚动,这就要求我们自己写事件了: 宗旨:判断鼠标是不是在flowLayoutPanel1区域内,如果在,设置flowLayoutPanel1的垂直滚动距离 给winform窗体加一个mousewheel监听事件 核心代码: private void Form1_MouseWheel(object sender, MouseEventArgs e) { //e.X e.Y以窗体左上角为原点,

js实现新闻滚动-单行滚动或者多行滚动

注明:都是转载. 先说单行滚动: --------直接复制以下代码即可试验 转载http://www.3lian.com/edu/2011/06-30/4986.html----------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xm