Question

大家，我正在尝试第一个例子 https://semantic-ui.com/collections/menu.html 将其悬停时它应该可以工作，但我在控制台中没有收到任何错误，但是即使单击任何内容也没有下拉菜单，但它无法工作发生这种情况是因为我正在使用语义UI CDN吗？

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Dev College</title>
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" />

        <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js"></script>


    </head>
    <body>
        <div class="ui text menu">
            <div class="item">
            <img src="default.png">
            </div>
            <a class="browse item">
            Browse Courses
            <i class="dropdown icon"></i>
            </a>
            <div class="ui right dropdown item">
            More
            <i class="dropdown icon"></i>
            <div class="menu">
                <div class="item">Applications</div>
                <div class="item">International Students</div>
                <div class="item">Scholarships</div>
            </div>
            </div>
        </div>
        <div class="ui flowing basic admission popup">
            <div class="ui three column relaxed divided grid">
            <div class="column">
                <h4 class="ui header">Business</h4>
                <div class="ui link list">
                <a class="item">Design &amp; Urban Ecologies</a>
                <a class="item">Fashion Design</a>
                <a class="item">Fine Art</a>
                <a class="item">Strategic Design</a>
                </div>
            </div>
            <div class="column">
                <h4 class="ui header">Liberal Arts</h4>
                <div class="ui link list">
                <a class="item">Anthropology</a>
                <a class="item">Economics</a>
                <a class="item">Media Studies</a>
                <a class="item">Philosophy</a>
                </div>
            </div>
            <div class="column">
                <h4 class="ui header">Social Sciences</h4>
                <div class="ui link list">
                <a class="item">Food Studies</a>
                <a class="item">Journalism</a>
                <a class="item">Non Profit Management</a>
                </div>
            </div>
            </div>
        </div>
    </body>
    </html>

Answer 1

示例代码不包含任何javascript，就像同一页面上的其他示例一样。如果您希望下拉菜单正常工作，请查看“用法”标签下的下拉文档，该文档详细讨论了如何在菜单内耦合下拉菜单。 Dropdowns。 CDN很好。

悬停时的语义ui下拉列表

1 个答案: