jQuery slideDown Snap Back Issue

前端之家收集整理的这篇文章主要介绍了jQuery slideDown Snap Back Issue前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有同样的问题,我正在阅读关于整个网络,虽然我找不到解决方案。

简单的说,在我的DIV元素上使用slideDown()方法时,我会得到一个丑陋的回弹效果,其中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的高度,然后在调用slideDown()之前强制使用CSS()的高度,但jQuery几乎总是错误的高度…

响应div也使用display:none属性隐藏。

然后这个函数调用

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

编辑
我忘了提到,如果div只包含1个字,则回退效果不会发生..但如果我用空格键入多个单词,则会发生。

它几乎像添加空间导致高度拧紧。

解决方法

看看修复:
SlideDown Animation Jump Revisited
2. Fixing jQuery’s slideDown() jump effect

在jQuery网站上也有同样的错误记录(修复):http://docs.jquery.com/Tutorials:Getting_Around_The_Minimum_Height_Glitch

并尝试在您的代码之前添加以下代码(on document):

$('.new').css('height',$('.new').height());
$('.new').hide();

这样你就可以明确设置高度,并且一定要首先显示你的div,上面的代码会在以后隐藏起来,因为我认为没有把正确的高度设置为隐藏的div,尽管你可以尝试。祝你好运〜

原文链接:https://www.f2er.com/jquery/181685.html

猜你在找的jQuery相关文章