jQuery slideDown Проблема с Snap Back

У меня та же проблема, о которой я читаю в Интернете, хотя я не могу найти решение .

Проще говоря, при использовании метода slideDown () в моих элементах DIV я получаю тот уродливый эффект возврата, когда jQuery слишком сильно сдвигает размер DIV, а затем возвращается к фактическому размеру некрасивым образом.

Просматривая Интернет, iv попытался удалить все поля и отступы у вызывающих ошибку элементов, но ничего не сделал.

Я не могу установить статические размеры для div, потому что каждый из них будет меняться при загрузке страницы. Один загружен, хотя они не меняются. (новые div также создаются с использованием ajax)

Вот пример DIV

<div class="response hidden new">  
<div class="right"><span class="responseTime">10:28:10 AM</span></div>  
<span class="responseUser">Someone</span><br> 
<span class="responseMessage">sdgs sdgh</span>
</div>

и CSS

div.response {
line-height: 20px;
border-bottom: 1px dotted #546268;
}

.responseMessage {display: block}

. Кто-нибудь может мне здесь помочь? У меня нет идей .. Ив попытался использовать jQuery, чтобы определить высоту DIV, а затем принудительно установить высоту с помощью CSS () перед вызовом slideDown (), но jQuery почти всегда ошибался насчет высоты ...

Ответ div также скрывается с помощью свойства display: none.

Эта функция затем вызывается для него

function quickResponse(time, user, message, epoch) {
    $('.latestStar').remove();
    addResponse(time, user, message, epoch);
        $('.new').slideDown(500).removeClass('hidden');
    $('html, body').animate({ scrollTop: '0px'}, 1000, function() {
    });     
}

Edit (новые div также создаются с использованием ajax)

Вот пример DIV

<div class="response hidden new">  
<div class="right"><span class="responseTime">10:28:10 AM</span></div>  
<span class="responseUser">Someone</span><br> 
<span class="responseMessage">sdgs sdgh</span>
</div>

и CSS

div.response {
line-height: 20px;
border-bottom: 1px dotted #546268;
}

.responseMessage {display: block}

. Кто-нибудь может мне здесь помочь? У меня нет идей .. Ив попытался использовать jQuery, чтобы определить высоту DIV, а затем принудительно установить высоту с помощью CSS () перед вызовом slideDown (), но jQuery почти всегда ошибался насчет высоты ...

Ответ div также скрывается с помощью свойства display: none.

Эта функция затем вызывается для него

function quickResponse(time, user, message, epoch) {
    $('.latestStar').remove();
    addResponse(time, user, message, epoch);
        $('.new').slideDown(500).removeClass('hidden');
    $('html, body').animate({ scrollTop: '0px'}, 1000, function() {
    });     
}

Edit (новые div также создаются с использованием ajax)

Вот пример DIV

<div class="response hidden new">  
<div class="right"><span class="responseTime">10:28:10 AM</span></div>  
<span class="responseUser">Someone</span><br> 
<span class="responseMessage">sdgs sdgh</span>
</div>

и CSS

div.response {
line-height: 20px;
border-bottom: 1px dotted #546268;
}

.responseMessage {display: block}

. Кто-нибудь может мне здесь помочь? У меня нет идей .. Ив попытался использовать jQuery, чтобы определить высоту DIV, а затем принудительно установить высоту с помощью CSS () перед вызовом slideDown (), но jQuery почти всегда ошибался насчет высоты ...

Ответ div также скрывается с помощью свойства display: none.

Эта функция затем вызывается для него

function quickResponse(time, user, message, epoch) {
    $('.latestStar').remove();
    addResponse(time, user, message, epoch);
        $('.new').slideDown(500).removeClass('hidden');
    $('html, body').animate({ scrollTop: '0px'}, 1000, function() {
    });     
}

Edit Я забыл упомянуть, что если div содержит только 1 слово, эффекта возврата не происходит .. но если я набираю несколько слов с пробелами, это происходит ..

Это почти как добавление пробелов приводит к падению высоты.