我在我的页面上运行了这个脚本,通过更改其“左”css 属性将 div 部分移出屏幕。如果页面请求包含查询字符串,它会在页面加载时发生:
function pageLoad() {
var isQueryRequest = isQueryPostback(); // check for query string
if(isQueryRequest)
{
document.getElementById("container").style.left = -340; // not working
document.getElementById("selectorText").innerHTML = "<< Show Query View";
document.getElementById("querySelector").onclick = slideOut;
}
else
{
document.getElementById("selectorText").innerHTML = "<< Hide Query View";
document.getElementById("querySelector").onclick = slideIn;
}
}
<div id="container" style="position:relative; left:30px;" >
// contains other divs
</div>
我已确认执行进入第一个 if block ,但该行未在 Firefox 或 Chrome 中执行。它在 IE 中执行得很好。 firebug看页面没有明显错误。
不知道它是否相关,但这在 .aspx 页面中运行。
编辑 - 下面的 slideIn() 和 slideOut():
function slideOut() {
var slidingDiv = document.getElementById("container");
var stopPosition = 30;
if (parseInt(slidingDiv.style.left) < stopPosition) {
slidingDiv.style.left = parseInt(slidingDiv.style.left) + 28 + "px";
setTimeout(slideOut, 1);
}
document.getElementById("selectorText").innerHTML = "<< Hide Query View";
document.getElementById("querySelector").onclick = slideIn;
}
function slideIn() {
var slidingDiv = document.getElementById("container");
var stopPosition = -340;
if (parseInt(slidingDiv.style.left) > stopPosition) {
slidingDiv.style.left = parseInt(slidingDiv.style.left) - 28 + "px";
setTimeout(slideIn, 1);
}
document.getElementById("selectorText").innerHTML = "<< Show Query View";
document.getElementById("querySelector").onclick = slideOut;
}
最佳答案
这可能会给你带来问题:
.innerHTML = "<< Show Query View";
避开那些小于号,因为它们可能呈现为 HTML,这会搞砸您的布局:
.innerHTML = "<< Show Query View";
关于javascript - 使用 Javascript 更改相对 div 的左侧位置在 firefox/chrome 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5860582/