Question

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

我正在使用

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

但是我看到当动画发生时段落包装。它看起来很难看。

有关不良影响的示例，请参阅this js fiddle。

您如何推荐获得相同效果但没有包装？（例如.slideUp() / slideDown()）...

感谢您的帮助

Answer 1

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

Updated fiddle with fix here

Answer 2

试试这个：

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/

jQuery动画幻灯片左边没有文本环绕

2 个答案: