DIV随滚动条滚动而滚动的实现代码【推荐】


Posted in Javascript onApril 12, 2016

记得以前写这样的代码比较麻烦,现在有了JQuery简单多了,就几行代码搞定!

<script type="text/javascript" src="Js/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随滚动条滚动而滚动的实现代码【推荐】就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
打开新窗口关闭当前页面不弹出关闭提示js代码
Mar 18 Javascript
javascript获取网页宽高方法汇总
Jul 19 Javascript
js实现的早期滑动门菜单效果代码
Aug 27 Javascript
javascript实现对表格元素进行排序操作
Nov 18 Javascript
js数组常用操作方法小结(增加,删除,合并,分割等)
Aug 02 Javascript
bootstrap datepicker 与bootstrapValidator同时使用时选择日期后无法正常触发校验的解决思路
Sep 28 Javascript
详解RequireJS按需加载样式文件
Apr 12 Javascript
JS+jQuery实现注册信息的验证功能
Sep 26 jQuery
javascript中toFixed()四舍五入使用方法详解
Sep 28 Javascript
javaScript实现游戏倒计时功能
Nov 17 Javascript
30分钟用Node.js构建一个API服务器的步骤详解
May 24 Javascript
详解JS数组方法
Nov 20 Javascript
原生js实现百叶窗效果及原理介绍
Apr 12 #Javascript
CascadeView级联组件实现思路详解(分离思想和单链表)
Apr 12 #Javascript
jquery中实现时间戳与日期相互转换
Apr 12 #Javascript
Angular.js与Bootstrap相结合实现表格分页代码
Apr 12 #Javascript
JS代码防止SQL注入的方法(超简单)
Apr 12 #Javascript
zTree插件下拉树使用入门教程
Apr 11 #Javascript
对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache详解
Apr 11 #Javascript
You might like
用PHP制作的意见反馈表源码
2007/03/11 PHP
PHP实现获取域名的方法小结
2014/11/05 PHP
php中adodbzip类实例
2014/12/08 PHP
php实现微信发红包
2015/12/05 PHP
yii通过小物件生成view的方法
2016/10/08 PHP
PHP上传文件及图片到七牛的方法
2018/07/25 PHP
修改jquery里的dialog对话框插件为框架页(iframe) 的方法
2010/09/14 Javascript
按Enter键触发事件的jquery方法实现代码
2014/02/17 Javascript
jquery实现对联广告的方法
2015/02/05 Javascript
跟我学习javascript的严格模式
2015/11/16 Javascript
jQuery解析与处理服务器端返回xml格式数据的方法详解
2016/07/04 Javascript
jQuery实现简单倒计时功能的方法
2016/07/04 Javascript
利用jQuery异步上传文件的插件用法详解
2017/07/19 jQuery
Chrome调试折腾记之JS断点调试技巧
2017/09/11 Javascript
Webpack之tree-starking 解析
2018/09/11 Javascript
详解如何快速配置webpack多入口脚手架
2018/12/28 Javascript
微信小程序时间轴实现方法示例
2019/01/14 Javascript
jquery实现拖拽小方块效果
2020/12/10 jQuery
Python操作json数据的一个简单例子
2014/04/17 Python
在Django的URLconf中使用命名组的方法
2015/07/18 Python
python logging日志模块以及多进程日志详解
2018/04/18 Python
一看就懂得Python的math模块
2018/10/21 Python
Python 中 function(#) (X)格式 和 (#)在Python3.*中的注意事项
2018/11/30 Python
详解Python3 基本数据类型
2019/04/19 Python
python tkinter 设置窗口大小不可缩放实例
2020/03/04 Python
is_file和file_exists效率比较
2021/03/14 PHP
美国女孩洋娃娃店:American Girl
2017/10/24 全球购物
西班牙香水和化妆品网上商店:Douglas
2017/10/29 全球购物
迪卡侬(Decathlon)加拿大官网:源自法国的运动专业超市
2020/11/22 全球购物
经济信息管理专业大学生求职信
2013/09/27 职场文书
初中音乐教学反思
2014/01/12 职场文书
《黄河颂》教学反思
2014/02/07 职场文书
黄金搭档广告词
2014/03/21 职场文书
2014年派出所工作总结
2014/11/21 职场文书
2015年仓库管理工作总结
2015/05/25 职场文书
oracle通过存储过程上传list保存功能
2021/05/12 Oracle