打字效果 - 添加回车和闪烁光标

时间:2013-04-23 20:32:24

标签: javascript

我一直在使用TheZillion提供的简单打字效果脚本。

<html>    
    <head>
        <title>Typing Effect - by Zillion</title>
        <script type='text/javascript'>
            var index = 0;
            var text = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque tincidunt, nulla at tempus tristique, nisl leo molestie est, ut vestibulum mauris mauris a odio. Sed at massa vitae ipsum venenatis porta. Integer iaculis pretium tempus. Donec viverra sollicitudin velit non gravida. Phasellus sit amet tortor odio. Vivamus lectus nisl, suscipit porttitor bibendum ut, tristique quis dui. Vestibulum non eros leo. Maecenas tincidunt semper turpis, a tristique purus pretium sit amet. Praesent nec neque tortor.Donec suscipit tristique ante quis molestie. Phasellus ac lacus non felis faucibus dictum vitae ac ipsum. Sed pharetra nulla sodales nulla porta imperdiet. Quisque pretium hendrerit laoreet.';
            // Here you can put in the text you want to make it type.
            function type() {
                document.getElementById('screen').innerHTML += text.charAt(index);
                index += 1;
                var t = setTimeout('type()', 100);
                // The time taken for each character here is 100ms. You can change it if you want.
            }
        </script>
    </head>

    <body onload='type()'>
        <!-- And here, you create the container in which you display the typed text -->
        <div id='screen'></div>
    </body>
</html>

我想将回车添加到var text字符串 目前,未识别出"\n", "\r",个Unicode表示或HTML标记。

我还想添加一个闪烁的光标,该光标位于var text字符串中输入的字母之前。

非常感谢任何帮助。

以下是jsFiddle

中的代码

0 个答案:

没有答案
相关问题