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 相关文章推荐
jQuery点击后一组图片左右滑动的实现代码
Aug 16 Javascript
JavaScript的21条基本知识点
Mar 04 Javascript
js时间日期格式化封装函数
Dec 02 Javascript
编写简单的jQuery提示插件
Dec 21 Javascript
详谈LABJS按需动态加载js文件
May 07 Javascript
100多个基础常用JS函数和语法集合大全
Feb 16 Javascript
JavaScript实现向select下拉框中添加和删除元素的方法
Mar 07 Javascript
深入探讨JavaScript的最基本部分之执行上下文
Feb 12 Javascript
关于vue3默认把所有onSomething当作v-on事件绑定的思考
May 15 Javascript
OpenLayers3实现地图显示功能
Sep 25 Javascript
React Native登录之指纹登录篇的示例代码
Nov 03 Javascript
vue使用echarts实现折线图
Mar 21 Vue.js
原生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 $_ENV为空的原因分析
2009/06/01 PHP
PHP 开源AJAX框架14种
2009/08/24 PHP
PHP 删除文件与文件夹操作 unlink()与rmdir()这两个函数的使用
2011/07/17 PHP
浅析php中如何在有限的内存中读取大文件
2013/07/02 PHP
CentOS 安装 PHP5.5+Redis+XDebug+Nginx+MySQL全纪录
2015/03/25 PHP
php实现点击可刷新验证码
2015/11/07 PHP
Thinkphp事务操作实例(推荐)
2017/04/01 PHP
javascript 无提示关闭窗口脚本
2009/08/17 Javascript
JS对话框_JS模态对话框showModalDialog用法总结
2014/01/11 Javascript
nodejs npm package.json中文文档
2014/09/04 NodeJs
复制网页内容,粘贴之后自动加上网址的实现方法(脚本之家特别整理)
2014/10/16 Javascript
JS实现刷新父页面不弹出提示框的方法
2016/06/22 Javascript
javascript运算符——逻辑运算符全面解析
2016/06/27 Javascript
微信小程序三级联动地址选择器的实例代码
2017/07/12 Javascript
JavaScript中变量提升与函数提升经典实例分析
2018/07/26 Javascript
Vue项目打包部署到iis服务器的配置方法
2019/10/14 Javascript
小程序实现上传视频功能
2020/08/18 Javascript
Ant design vue table 单击行选中 勾选checkbox教程
2020/10/24 Javascript
[01:07:20]DOTA2-DPC中国联赛 正赛 Dynasty vs XG BO3 第二场 2月2日
2021/03/11 DOTA
Python模块学习 datetime介绍
2012/08/27 Python
python使用pil生成缩略图的方法
2015/03/26 Python
Python2和3字符编码的区别知识点整理
2019/08/08 Python
Python发送邮件的实例代码讲解
2019/10/16 Python
CSS3中文字镂空、透明值、阴影效果设置示例小结
2016/03/07 HTML / CSS
Oakley官网:运动太阳镜、雪镜和服装
2016/09/30 全球购物
信息技术专业大学生个人的自我评价
2013/10/05 职场文书
高一物理教学反思
2014/01/24 职场文书
大学毕业感言100字
2014/02/03 职场文书
工作决心书范文
2014/03/11 职场文书
搞笑的获奖感言
2014/08/16 职场文书
2014年物业管理工作总结
2014/11/21 职场文书
六一儿童节致辞稿(3篇)
2019/07/11 职场文书
《风不能把阳光打败》读后感3篇
2020/01/06 职场文书
一行代码python实现文件共享服务器
2021/04/22 Python
Python+pyaudio实现音频控制示例详解
2022/07/23 Python
Redis配置外网可访问(redis远程连接不上)的方法
2022/12/24 Redis