用无序列表键入文本脚本

I have been using the typewriter.js effect for a while. Works great. now I want to use it with a unodered list (ul), but if I use any tags, the effect does not want to work. Any help?

我一直在使用typewriter.js效果。效果很好。现在我想将它与未经编辑的列表(ul)一起使用,但是如果我使用任何标签,效果就不会起作用了。有帮助吗?

Heres the js script I'm working with: http://www.dynamicdrive.com/dynamicindex10/text5.htm

下面是我正在使用的js脚本:http://www.dynamicdrive.com/dynamicindex10/text5.htm

Example:

With the example javascript from link and this:

使用链接中的示例javascript和此:

<p id="aboutskills">Windows 2008 Servers</p>
<script type="text/javascript">

        new TypingText(document.getElementById("aboutskills"));

        TypingText.runAll();
        </script>

This works!

But this:

      <p id="aboutskills">
            <ul class="skills">
                <li>Windows 2008 Servers</li>
                <li>Network Analysis</li>
                <li>Bash, Batch, Powershell scripting</li>
                <li>C#, VB .Net</li>
            </ul>
      <p>

    <script type="text/javascript">

    new TypingText(document.getElementById("aboutskills"));

    TypingText.runAll();
    </script>

Does NOT Work!

不起作用!

1 个解决方案

#1

The problem is because you can't have <ul> element inside <p>.

问题是因为

中没有

If you inspect your HTML in Chrome DevTools or Firebug you should see something like this (BTW you have no </p>):

如果您在Chrome DevTools或Firebug中检查HTML,您会看到类似这样的内容(顺便说一句,您没有 ):

<p id="aboutskills"></p>
<ul class="skills">
    <li>Windows 2008 Servers</li>
    <li>Network Analysis</li>
    <li>Bash, Batch, Powershell scripting</li>
    <li>C#, VB .Net</li>
</ul>
<p></p>

Read more here: https://developers.whatwg.org/grouping-content.html#the-p-element

在此处阅读更多内容:https://developers.whatwg.org/grouping-content.html#the-p-element

So, you can just change <p> into <div> and everything will work properly: http://jsfiddle.net/8cd88fn0/

所以,您可以将

更改为

,一切都会正常运行:http://jsfiddle.net/8cd88fn0/

1 个解决方案

#1

更多相关文章

随机推荐