Autocomplete Scriptaculous自动完成程序结果列表位置问题

Autocomplete Scriptaculous自动完成程序结果列表位置问题,autocomplete,positioning,scriptaculous,Autocomplete,Positioning,Scriptaculous,我正在使用Scriptic Autocompleter 1.9.0。我的问题是,结果列表div在Chrome和Firefox中的位置不正确,但在IE中有效。结果列表div显示在文本框的顶部。我能够修改controls.js并修复这个问题,但是我想知道我是否在样式表上做了一些错误的事情。这是我的密码: style.css: div#autocomplete { position: relative; } input#query { width:500px; } div#answerli

我正在使用Scriptic Autocompleter 1.9.0。我的问题是,结果列表div在Chrome和Firefox中的位置不正确,但在IE中有效。结果列表div显示在文本框的顶部。我能够修改controls.js并修复这个问题,但是我想知道我是否在样式表上做了一些错误的事情。这是我的密码:

style.css:
div#autocomplete
{
  position: relative;
}

input#query {
  width:500px;
}

div#answerlist {
  width:500px;
  max-height:700px;
  overflow-y:scroll;
  overflow-x:auto;
  border:1px solid #CCCCCC;
}

index.phtml:

<div id="webphone" style="width: 1000px">
<center>
<label>Search:</label>
<input type="text" name="query" id="query"></input>
</center>
<div id="answerlist"></div>
</div>

<script type="text/javascript">
new Ajax.Autocompleter("query","answerlist","index/search", {frequency: 0.5, minChars: 1});
</script>

首先,alert函数总是返回空字符串,即使我显式地将answerlist的position样式设置为relative或absolute。其次,即使脚本显式地将位置设置为绝对位置并定位元素,但最终位置是不正确的!我是唯一经历过这种情况的人吗?我在linux和windows上试用了许多版本的chrome和firefox。我一定是做错了什么。当然,我可以通过注释掉这部分代码并使用绝对定位来定位div元素来解决这个问题。但我不想那样做…

在与同一问题斗争之后,我找到了解决方案,并在

此处描述了修复方法,但基本上,Element.clonePosition具有以下功能:

if (parent == document.body) {
    delta[0] -= document.body.offsetLeft;
    delta[1] -= document.body.offsetTop;
}
必须由以下内容取代:

if (parent == document.body) {
    var parentOffset = Element.viewportOffset(parent);
    delta[0] -= parentOffset[0];
    delta[1] -= parentOffset[1];
}

非常感谢你。我也有同样的问题,这就解决了。
if (parent == document.body) {
    var parentOffset = Element.viewportOffset(parent);
    delta[0] -= parentOffset[0];
    delta[1] -= parentOffset[1];
}