Изменение размера и размещение div с помощью JavaScript

Question

Я пытаюсь сделать простое изменение размера и расположение элемента div, который показывает загрузочную картинку ajax. Загружаемое содержимое может изменить размер, поэтому я хочу, чтобы размер элемента div был таким же, как и размер родительского элемента, который в данном случае является табличным измерением с идентификатором "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, который у меня есть, и он выдает ошибки на

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

говоря "div.style не определен". Что здесь не так?

div в html выглядит следующим образом:

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

Функция js вызывается следующим образом:

<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;
}

Есть ли лучший способ справиться с тем, что я пытаюсь сделать?

Answer 1

I создал базовую тестовую страницу из предоставленного вами кода и не смог воспроизвести проблему. Это говорит о том, что на вашей странице происходит что-то еще, что вызывает поведение, которое вы видите.

Не могли бы вы взять свою страницу и сократить ее до минимального случая, который демонстрирует ошибку JavaScript? Вы обнаружите, что выполнение этого процесса часто выявляет причину ошибки - вы что-то удалите, и она начнет работать, указывая на то, что что-то в этом удаленном разделе кода является источником проблемы:)

Answer 2

div.style.width не является допустимым свойством для доступа к ширине div.

используйте div.offsetWidth и div.offsetHeight для ширины и высоты соответственно.