jQuery动画slidelleft没有文本换行

jQuery animation slideLeft without text wrapping

本文关键字:文本 换行 动画 slidelleft jQuery      更新时间:2023-09-26

我想使用jQuery从左到右显示/隐藏一段文本。

我用

$('#text').animate({
     width: ['toggle', 'swing']
});

然而,我看到段落包装动画正在发生。而且它看起来很丑。

查看这个js提琴的一个不希望的效果的例子。

你建议如何在没有包装的情况下获得相同的效果?(如.slideUp()/slideDown())…

感谢您的帮助

您需要在容器上设置overflow: hidden,然后将动画应用于容器。

试试这个:

CSS:

#wrap{
 width:200px;   
    overflow: Hidden;
}
#text{
 width:200px;  
}

脚本:

setTimeout(
function(){
    $('#wrap').animate( // Changed to slide the wrap instead of the #text
        {
            width: ['toggle', 'swing']
        })
    },
1000);
http://jsfiddle.net/RDsqy/2/