Динамическое назначение высоты div в jQuery

Question

У меня есть div с классом "divItemclass" для этого класса, я установил высоту как auto. Этот div содержит некоторые данные (текст / изображения). Теперь я хочу изменить класс на другой, когда пользователь нажимает кнопку удаления. Я использую приведенный ниже код, чтобы сделать это

$("#divRoundItem").removeClass().addClass("divGlowToDelete").fadeIn(500);

и в моем css

.divGlowToDelete
{
background-color:Red;
border:1px solid red;
height:auto;
 }

Но когда это происходит, так как я задал высоту как auto, она не показывает красный цвет bg для всего div. Если я изменю высоту с авто на фиксированную высоту (например, 20 пикселей), она будет отображаться красным цветом bg с такой большой высоты.

Но я не могу упомянуть высоту, поскольку длина содержимого внутри div является динамической. Как это решить? Я думаю, что было бы хорошо, если бы я мог взять текущую высоту div и присвоить ее новому классу (divGlowToDelete) во время выполнения (при изменении класса).

Answer 1

Будет ли это работать, если вы установите высоту с помощью jQuery после добавления нового класса?

$("#roundItem")
    .removeClass()
    .addClass("divGlowToDelete")
    .css("height","auto")
    .fadeIn(500);

Answer 2

Ваша проблема связана с очисткой поплавков?

http://www.quirksmode.org/css/clearing.html

Answer 3

Возможно, стоит попытаться установить высоту

явно с помощью jQuery при загрузке страницы:

$(document).ready(function() {
    ...
    var $theDiv = $('#divRoundItem');
    $theDiv.css('height', $theDiv.height() + 'px');
    ...
});

Answer 4

Вы можете получить или установить высоту div, вызвав метод height.