div移动到指定元素位置

1、html部分

1 <!--指定元素-->
2 <div id="div1" style="margin: 500px 0px 0px 500px; width: 200px;"><input type="text" name="Name" /></div>
3 <!--显示面板-->
4 <div id="Pannel" style="display: none; position: absolute; border: 1px solid #e1e1e1;">
5 <h1>内容部分</h1>
6 </div>

View Code

2、js部分

 1    $("input[name='Name']").on("click", function () {
 2             //获取当前元素
 3             var elem = $(this);
 4             var tops = elem.offset().top + elem[0].offsetHeight;
 5             //设置当前元素的宽、距离浏览器顶部、距离浏览器左边
 6             $("#Pannel").css({
 7                 width: (elem[0].offsetWidth + 50) + "px",
 8                 height:'200px',
 9                 top: tops + "px",
10                 left: elem.offset().left + "px"
11             }).show();
12         });

View Code

 

转载于:https://www.cnblogs.com/study10000/p/10417615.html