首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >文本中的动画,从右到左隐藏文本已挂载

文本中的动画,从右到左隐藏文本已挂载
EN

Stack Overflow用户
提问于 2015-04-22 17:09:14
回答 1查看 284关注 0票数 1

我想做一个动画文字,隐藏文字从右到左,但字母是挂载动画之后…我知道我可以使用white-space: nowrap,但我需要它作为一个段落

如何在没有挂载字母的情况下对此文本进行动画处理?

JSfiddle Example

代码语言:javascript
复制
        setTimeout(function () {
            $("#title").animate({width: 'hide'});
            $("#description").animate({width: 'hide'});
            $("#text1").animate({width: 'hide'});
        },2000);
代码语言:javascript
复制
.bold{
    font-size: 48px;
    color: black;
    width: 400px;
}
.normal{
    font-size: 48px;
    color: black;
    width: 400px;
}
#container{
    width: 452px;
    height: 625px;
}
#description{
    margin-top: 40px;
    margin-bottom: 50px;
}
#description,#text1{
    margin-left: 25px;
}
代码语言:javascript
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container" >
        <div id="title" class="bold">
            1231231231123
        </div>
        <div id="description"class="normal">asd asd as da sd asdfsdfasdfasd asd fsadf asdf asdfasdf.</div>
        <div id="text1" class="bold">
            aaaaaaaaaaaaaaaa aaaaaaaaaaaa            
        </div>
    </div>

EN

回答 1

Stack Overflow用户

发布于 2015-04-22 17:26:29

根据您的布局,如果可能,您应该对#container进行动画处理

代码语言:javascript
复制
setTimeout(function () {
    $("#container").animate({
        width: 'hide'
    });
}, 2000);

Exemple

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/29792767

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档