jquery 设置元素相对于另一个元素的top值(实例代码)
更新时间：2013年11月06日 08:43:50 投稿：jingxian
在jquery中offset().top是相对于body来说的，另外在设置top值的时候要找到与该元素最近的有相对值的元素
<div id="span1">sfdsfsddfsdf</div>
<span id="span2" style="position:relative">
<input id="input" type="text"></input>
<input id="button" type="button"></input>
</span>
设置button在input的下方
$("#button").css("{top":$("#input").offset().top-$("#span2").offset().top+$("#input").height,position:"absolute"});
这样input在哪个位置button都在input的下边，同样可以运用到日历小插件在input文本框的下方
1、在jquery中offset().top是相对于body来说的，另外在设置top值的时候要找到与该元素最近的有相对值的元素
在js中可以这样写：
复制代码 代码如下:
//取得HTML控件绝对位置
Calendar.prototype.getAbsPoint = function (e){
var x = e.offsetLeft;
var y = e.offsetTop;
while(e = e.offsetParent){
x += e.offsetLeft;
y += e.offsetTop;
}
return {"x": x, "y": y};
}
var xy = this.getAbsPoint(popControl);
this.panel.style.left = xy.x + "px";
this.panel.style.top = (xy.y + dateObj.offsetHeight) + "px";
如图所示：
相关文章
这篇文章主要介绍了jQuery操作Dom元素、jQuery遍历、JavaScript遍历，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习吧2023-01-01
这篇文章主要介绍了jQuery如何实现模糊搜索，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-05-05
这篇文章主要为大家介绍了jQuery实现多级联动下拉列表查询框，感兴趣的小伙伴们可以参考一下2016-01-01
这篇文章主要介绍了jquery.flot.js简单绘制折线图用法,结合实例形式分析了jQuery插件jquery.flot.js实现图形绘制的常用操作技巧,需要的朋友可以参考下2017-03-03
这篇文章主要介绍了jQuery中appendTo()方法用法,实例分析了appendTo()方法的功能、定义及把匹配的元素插入指定元素结尾的使用技巧,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了bootstrap table sum总数量统计实现方法,需要的朋友可以参考下2017-10-10
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
这篇文章主要介绍了jQuery+C#实现参数RSA加密传输功能,结合具体实例形式分析了js使用jsencrypt.js插件前端字符数据处理传输及C#后台数据转换与RSA加密相关操作技巧,并附带jsencrypt.js供读者下载参考使用,需要的朋友可以参考下2017-06-06
本文介绍了Jquery页面初始化的4种方式的实例代码，需要的朋友可以看下2016-11-11
本文将为大家收集10个超赞的jQuery图片滑块动画,都是小编精挑细选而来，希望这些现成的jQuery插件将为你节省很多开发时间。2016-01-01
谓切换事件，即有两个以上的事件绑定于一个元素，在元素的行为动作间进行切换,有两个方法用于事件的切换，一个方法是hover()，另一个是toggle(),感兴趣的朋友不妨了解下,或许对你有所帮助2013-02-02
最新评论