拥有一个由表单组成的Web应用程序,并将其设置为启动一个对话框,其中包含主题标签文本字段旁边的信息。 每当有人填写表单并点击提交时,表单的邮件正文(从表单的文本区域)显示在顶部, 表单显示在它下面。在此之前,我将其设置为固定(x,y),以使对话框显示在主题标签旁边。但是,现在,何时 页面变长,对话框不会出现在我的主题标签文本字段旁边。它显示的要低很多。
以下是找到职位的代码:
// Finds the position and adds 40px to the left axis.
function findPosition(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
} while (obj = obj.offsetParent);
curleft += 42;
// alert ('[' + curleft + ', ' + curtop + ']');
return [curleft,curtop];
}
}
以下是调用此函数以在特定位置显示对话框的代码:
function displayDialog() {
var subjectLabel = document.getElementById("myform.subjectLabel");
$("#myDialog").dialog({
open: function(event, ui) {
jQuery('.ui-dialog-titlebar-close')
.removeClass("ui-dialog-titlebar-close")
.html('<span padding-right = "16px;">Close</span>');
},
hide: true,
draggable: false,
position: findPosition(subjectLabel),
closeOnEscape: false
});
}
如何设置它以便我的findPosition()计算在页面太长时(当需要滚动条时)不会错误计算?
有没有办法将相对定位设置为始终让对话框显示在主题标签右侧40px?
感谢您抽出宝贵时间阅读本文。
答案 0 :(得分:1)
您可以使用CSS完成此操作。通过将标签的CSS设置为位置:相对并在位置:绝对中放置 div ,您可以将容器放在任何您想要的位置相对于标签。
请注意,如果您要尝试相对于表格单元格定位div,则需要做一些额外的工作。如果以上内容对您不起作用,请告诉我,我可以挖掘出完整的解决方案。
.mylabel {
position: relative;
}
.mylabelfriend {
display: none; /* if you don't want these 100% of the time */
position: absolute;
left: 40px;
top: 0;
}