基于jquery的DIV随滚动条滚动而滚动的代码


Posted in Javascript onJuly 20, 2012

核心代码:

<script type="text/javascript" src="http://demo.3water.com/jslib/jquery/jquery-1.7.2.min.js"></script> 
<script type="text/javascript"> 
$(function() { 
$(window).scroll(function() { 
var top = $(window).scrollTop()+200; 
var left= $(window).scrollLeft()+320; 
$("#editInfo").css({ left:left + "px", top: top + "px" }); 
}); 
}); 
</script> <div id="editInfo" style="float:left;width:300px;background-color:#ccc;position:absolute;top:200px;"> 
<div>用户名:<input type="text" /></div> 
<div>密码:<input type="text" /></div> 
<div>年龄:<input type="text" /></div> 
<div>备注:<input type="text" /></div> 
<div><input type="button" value="保存" /></div> 
</div> 
<div style="height:1500px"></div>

在线演示 http://demo.3water.com/js/2012/jquery_demo/jquery_div.html
记得以前写这样的代码比较麻烦,现在有了JQuery简单多了,就几行代码搞定!
Javascript 相关文章推荐
javascript 嵌套的函数(作用域链)
Mar 15 Javascript
jquery 模拟类搜索框自动完成搜索提示功能(改进)
May 24 Javascript
Google Map V3 绑定气泡窗口(infowindow)Dom事件实现代码
Apr 26 Javascript
js onload处理html页面加载之后的事件
Oct 30 Javascript
JavaScript将数字转换成大写中文的方法
Mar 23 Javascript
详解Vue中数组和对象更改后视图不刷新的问题
Sep 21 Javascript
微信小程序实现文字跑马灯
May 26 Javascript
Vue核心概念Action的总结
Jan 18 Javascript
vue+vuex+json-seiver实现数据展示+分页功能
Apr 11 Javascript
vue微信分享插件使用方法详解
Feb 18 Javascript
Jquery cookie插件实现原理代码解析
Aug 04 jQuery
解决vue项目中某一页面不想引用公共组件app.vue的问题
Aug 14 Javascript
最佳6款用于移动网站开发的jQuery 图片滑块插件小结
Jul 20 #Javascript
基于jquery的图片轮播 tab切换组件
Jul 19 #Javascript
JavaScript面向对象知识串结(读JavaScript高级程序设计(第三版))
Jul 17 #Javascript
JavaScript面向对象(极简主义法minimalist approach)
Jul 17 #Javascript
基于jQuery的获取标签名的代码
Jul 16 #Javascript
写自已的js类库需要的核心代码
Jul 16 #Javascript
js不完美解决click和dblclick事件冲突问题
Jul 16 #Javascript
You might like
php中常用编辑器推荐
2007/01/02 PHP
php printf输出格式使用说明
2010/12/05 PHP
php下通过IP获取地理位置的代码(小偷程序)
2011/06/09 PHP
php使用NumberFormatter格式化货币的方法
2015/03/21 PHP
JS input 数字验证代码
2009/07/30 Javascript
JS数学函数Exp使用说明
2012/08/09 Javascript
异步动态加载js与css文件的js代码
2013/09/15 Javascript
jQuery多项选项卡的实现思路附样式及代码
2014/06/03 Javascript
使用JS实现jQuery的addClass, removeClass, hasClass函数功能
2014/10/31 Javascript
JQuery入门基础小实例(1)
2015/09/17 Javascript
BootStrap轮播HTML代码(推荐)
2016/12/10 Javascript
基于jQuery实现一个marquee无缝滚动的插件
2017/03/09 Javascript
JavaScript之解构赋值的理解
2019/01/30 Javascript
浅谈vue加载优化策略
2019/03/19 Javascript
如何实现js拖拽效果及原理解析
2020/05/08 Javascript
python批量修改文件后缀示例代码分享
2013/12/24 Python
python之模拟鼠标键盘动作具体实现
2013/12/30 Python
合并百度影音的离线数据( with python 2.3)
2015/08/04 Python
Python一个简单的通信程序(客户端 服务器)
2019/03/06 Python
OpenCV python sklearn随机超参数搜索的实现
2020/01/17 Python
Python多线程正确用法实例解析
2020/05/30 Python
解决pyinstaller打包运行程序时出现缺少plotly库问题
2020/06/02 Python
Kears 使用:通过回调函数保存最佳准确率下的模型操作
2020/06/17 Python
The Hut德国站点:时装、家居用品、美容等
2016/09/23 全球购物
Hotels.com香港酒店网:你的自由行酒店订房专家
2018/01/22 全球购物
全球领先的中国制造商品在线批发平台:DHgate
2020/01/28 全球购物
娇韵诗Clarins意大利官方网站:法国天然护肤品牌
2020/03/11 全球购物
银行会计业务的个人自我评价
2013/11/02 职场文书
小学教师自我鉴定
2013/11/07 职场文书
医药专业推荐信
2013/11/15 职场文书
给校长的建议书200字
2014/05/16 职场文书
第二批党的群众路线教育实践活动个人整改方案
2014/10/31 职场文书
民事起诉书范本
2015/05/19 职场文书
Spring boot应用启动后首次访问很慢的解决方案
2021/06/23 Java/Android
Qt自定义Plot实现曲线绘制的详细过程
2021/11/02 Python