相关疑难解决方法(0)

我有一个<div>文字.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

我希望这里的文字<div>一次出现在第一页上:

L

Lo

Lor

... and so on, until the full text is visible

可接受的替代方案:一次执行一个单词,以避免由于软连字而导致HTML实体和跳跃单词出现问题.

如果用户点击<div>它,它应该取消动画并立即显示全文.

简而言之,我想模仿日本式冒险游戏中经常出现的动画.(我认为这有时被称为打字机或电传打字机效果.)这是一个很好的例子:

http://www.youtube.com/watch?feature=player_detailpage&v=SasgN0lim7M#t=418

显然,我可以使用JavaScript编写动画脚本 - 只需设置一个计时器并逐个附加字母(或单词).

但是在现代浏览器中使用CSS可以做我需要的吗？(当然,我至少需要在onclickJS中更改元素类,但这没关系.)

更新:澄清HTML实体的字符与字母和问题:

我的文字充斥着HTML:

Lo&shy;rem <i>ip&shy;sum</i>.

对于innerHTML逐字符附加文本的天真方法是行不通的:

L

Lo

Lo&

...Doh!

我正在尝试获取all_msg的文本，并使用hide方法将其隐藏，然后一次以一个字母淡入淡出它的时间，这是我的代码。

var $all_msg = $('#welcome_msg');
        function animate(i) {
            $all_msg.hide();
            $all_msg.text.each(function(index) {
                $(this).delay(700 + index).fadeIn(1100);
            })
        }

这就是控制台给我的回报：

$all_msg.text.each is not a function

我是一名新编码员，如果有人可以帮助我，那将对我有很大的帮助，谢谢。