使用javascript调整大小和存储库div [英] Resize and repositon div using javascript

查看:93
本文介绍了使用javascript调整大小和存储库div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图做一个简单的调整大小和重新定位的div元素,显示ajax加载图像。加载的内容可以更改大小,因此我想要将div元素调整为父级的大小,在这种情况下,它是具有ID为thEngineCategories的表维度。

I'm trying to do a simple resize and reposition of a div element that shows a ajax loading image. The content it loads can change size, so I want the div element to resize to be the size of the parent, which in this case is a table dimension with the id "thEngineCategories".

function resize_divProgress() {
    var control = document.getElementById('thEngineCategories');
    var div = document.getElementById('divProgress');

    div.style.left = control.offsetLeft + 'px';
    div.style.top = control.offsetTop + 'px';
    div.style.width = control.offsetWidth + 'px';
    div.style.height = control.offsetHeight + 'px';
}

以下是我的javascript和它的错误

The following is the javascript I have and it errors on

div.style.left = control.offsetLeft + 'px';

说div.style is undefined。这里有什么问题?

saying "div.style is undefined". Whats wrong here?

html中的div如下:

The div in html is as follows:

<div class="overlay" id="divProgress">

js函数的调用如下:

The js function is called as follows:

<th id="thEngineCategories" onmouseover="resize_divProgress()" >

CSS是:

.overlay
{
    border: black 1px solid;
    padding: 5px;
    z-index: 100;
    width: 300px;
    position: absolute;
    background-color: #fff;
    -moz-opacity: 0.75;
    opacity: 0.75;
    filter: alpha(opacity=75);
    font-family: Tahoma;
    font-size: 11px;
    font-weight: bold;
    text-align: center;
}

有更好的方法来处理我想要做的事吗? / p>

Is there a better way to handle what I'm trying to do?

推荐答案

创建了一个基本测试页从您提供的代码,并无法重现的问题。这表明您的网页还有其他原因导致您看到的行为。

I created a basic test page from the code you provided and couldn't reproduce the problem. This suggests there is something else going on in your page that is causing the behaviour you are seeing.

您可以将您的网页降低到最小的情况下JavaScript错误?你会发现执行这个过程通常会揭示错误的原因 - 你会删除的东西,它会开始工作,指示在删除部分的代码中的东西是问题的根源)。

Could you take your page and pare it down to a minimal case that demonstrates the JavaScript error? You'll find performing this process often will reveal the cause of the error - you'll remove something and it will start working, indicating that something in that removed section of code is the source of the problem :)

这篇关于使用javascript调整大小和存储库div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆