用jquery来定位


Posted in Javascript onFebruary 20, 2007

demo:http://www.healdream.com/upLoad/html/jquery/position/
down:
http://www.51files.com/?Z25US63TM6OBHQJ2XM58

用法:
首先当然是将两个js包含进来了

<script type="text/javascript" src="../jquery.js"></script> 
<!-- load dimensions.js (this is what we're testing! --> 
<script type="text/javascript" src="dimensions.js"></script>

 <script type="text/javascript" charset="utf-8"> 
            $(function() {//这个是$(document).ready()的简写 
                $('#userAgent').html(navigator.userAgent);//.html(str)方法是将当前dom用str替代 
                //navigator.userAgent这句是用来得到客户端的浏览器类型的 
                $('a').click(function(event) {//对链接的点击事件定义函数 
                    var href = this.href;//得到当前的链接字符串 
                    var id = href.substr(href.indexOf('#'));//得到#后面的字符串 
                    var options = {//定义各个参数,主要是待会move时用到 
                        margin:  parseInt( $('#margin').val()  ),//.val()方法是得到当前对象的value值 
                        border:  parseInt( $('#border').val()  ),//parseInt方法就是转换为int型,也就是整形 
                        padding: parseInt( $('#padding').val() ), 
                        scroll:  parseInt( $('#scroll').val()  ) 
                    }; 
                    var offset = {}; 
                    //offset方法是在dimensions.js里定义的 
                    $(id).offset(options, offset); 
                    $('#moveable').css(offset);//设置id为moveable的dom的css为offset 
                    return false; 
                }); 
            }); 
        </script>

主要的代码就这些了,是不是很简单啊
Javascript 相关文章推荐
jQuery 技巧大全(新手入门篇)
May 12 Javascript
jQuery模拟新浪微博首页滚动效果的方法
Mar 11 Javascript
AngularJS实现根据变量改变动态加载模板的方法
Nov 04 Javascript
JavaScript中浅讲ajax图文详解
Nov 11 Javascript
Bootstrap源码解读按钮(5)
Dec 23 Javascript
理解AngularJs篇:30分钟快速掌握AngularJs
Dec 23 Javascript
AngularJS实现的省市二级联动功能示例【可对选项实现增删】
Oct 26 Javascript
对Angular中单向数据流的深入理解
Mar 31 Javascript
理顺8个版本vue的区别(小结)
Sep 17 Javascript
浅谈webpack SplitChunksPlugin实用指南
Sep 17 Javascript
jQuery选择器之基本选择器用法实例分析
Feb 19 jQuery
sortable+element 实现表格行拖拽的方法示例
Jun 07 Javascript
NiftyCube——轻松实现圆角边框
Feb 20 #Javascript
nicejforms——美化表单不用愁
Feb 20 #Javascript
greybox——不开新窗口看新的网页
Feb 20 #Javascript
datePicker——日期选择控件(with jquery)
Feb 20 #Javascript
一直复略了的一个问题,关于表单重复提交
Feb 15 #Javascript
永不消失的title提示代码
Feb 15 #Javascript
Javascript操纵Cookie实现购物车程序
Feb 15 #Javascript
You might like
PHP生成等比缩略图类和自定义函数分享
2014/06/25 PHP
php中Session的生成机制、回收机制和存储机制探究
2014/08/19 PHP
php通过隐藏表单控件获取到前两个页面的url
2014/09/09 PHP
php广告加载类用法实例
2014/09/23 PHP
一个非常完美的读写ini格式的PHP配置类分享
2015/02/12 PHP
PHP 7的一些引人注目的新特性简单介绍
2015/11/08 PHP
javascript页面动态显示时间变化示例代码
2013/12/18 Javascript
使用jquery实现以post打开新窗口
2014/03/19 Javascript
javascript怎么禁用浏览器后退按钮
2014/03/27 Javascript
JavaScript分析、压缩工具JavaScript Analyser
2014/12/31 Javascript
Javascript 正则表达式实现为数字添加千位分隔符
2015/03/10 Javascript
Jsonp 关键字详解及json和jsonp的区别,ajax和jsonp的区别
2015/12/30 Javascript
jquery 将当前时间转换成yyyymmdd格式的实现方法
2016/06/01 Javascript
JS Array创建及concat()split()slice()的使用方法
2016/06/03 Javascript
jstl中判断list中是否包含某个值的简单方法
2016/10/14 Javascript
Bootstrap学习笔记之环境配置(1)
2016/12/07 Javascript
简单的渐变轮播插件
2017/01/12 Javascript
解决VantUI popup 弹窗不弹出或无蒙层的问题
2020/11/03 Javascript
[02:15]2014DOTA2国际邀请赛 专访LGD.lin小兔子是大腿
2014/07/14 DOTA
Python实现获取操作系统版本信息方法
2015/04/08 Python
Python脚本实现格式化css文件
2015/04/08 Python
用Python的Django框架编写从Google Adsense中获得报表的应用
2015/04/17 Python
win10系统中安装scrapy-1.1
2016/07/03 Python
Python编程实现二分法和牛顿迭代法求平方根代码
2017/12/04 Python
数据清洗--DataFrame中的空值处理方法
2018/07/03 Python
用Python写一个模拟qq聊天小程序的代码实例
2019/03/06 Python
用python生成(动态彩色)二维码的方法(使用myqr库实现)
2019/06/24 Python
基于python全局设置id 自动化测试元素定位过程解析
2019/09/04 Python
详解PyQt5中textBrowser显示print语句输出的简单方法
2020/08/07 Python
html5/css3响应式页面开发总结
2018/10/16 HTML / CSS
Html5 canvas画图白板踩坑
2020/06/01 HTML / CSS
澳大利亚首个在线预订旅游网站:Wotif
2017/07/19 全球购物
学校安全教育制度
2014/01/31 职场文书
村委会换届选举方案
2014/05/03 职场文书
办公室禁烟通知
2015/04/23 职场文书
企业愿景口号
2015/12/25 职场文书