使用CDN时,布尔玛折叠式无法工作

问题描述 投票:0回答:1

我已经包含CSS和JS CDN。我也尝试使用整个扩展CDN,但仍然无法正常工作。这是codepen。

https://codepen.io/firdausai/pen/rNxBLKr?editors=1000

<head>

    <!-- Load bulma CDN -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css">

<!-- Load bulma accordion CDN -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bulma-accordion.min.css">

    <!-- Load fontawesome CDN -->
<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
</head>
<body>
    <div class="card">
    <header class="card-header">
        <p class="card-header-title">
            Card title
        </p>
        <a href="#collapsible-card" data-action="collapse" class="card-header-icon is-hidden-fullscreen" aria-label="more options">
            <span class="icon">
                <i class="fas fa-angle-down" aria-hidden="true"></i>
            </span>
        </a>
    </header>
    <div id="collapsible-card" class="is-collapsible is-active">
        <div class="card-content">
            <p class="title is-4">
                “There are two hard things in computer science: cache invalidation, naming things, and off-by-one
                errors.”
            </p>
            <p class="subtitle is-5">
                Jeff Atwood
            </p>
        </div>
        <footer class="card-footer">
            <p class="card-footer-item">
                <span>
                    View on <a href="https://twitter.com/codinghorror/status/506010907021828096">Twitter</a>
                </span>
            </p>
            <p class="card-footer-item">
                <span>
                    Share on <a href="#">Facebook</a>
                </span>
            </p>
        </footer>
    </div>
</div>
    <script src = "https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bulma-accordion.min.js"></script>
</body>

任何建议?

bulma
1个回答
0
投票

读取the documentation,您必须添加此行:

var accordions = bulmaAccordion.attach(); // accordions now contains an array of all Accordion instances

也如文档中所述,有一个具有许多新功能here的新版本,我正在使用它,我发现它比bulma手风琴更好。

© www.soinside.com 2019 - 2024. All rights reserved.