2016-11-10 13 views
0

私のプロジェクトでは、これまで成功していたUIKitを使用しています。最近、私はUIKitアコーディオンを初めて使用しようとしていて、ひどく失敗しました。基本的なUIKit(getuikit)のアコーディオンが動作しない

だから私はちょうどこの

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <link rel="stylesheet" href="css/uikit.min.css" /> 
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
    <script src="js/uikit.min.js"></script> 
</head> 
<body> 
<div class="uk-accordion" data-uk-accordion> 

    <h3 class="uk-accordion-title">Test 1</h3> 
    <div class="uk-accordion-content">Whatever</div> 

    <h3 class="uk-accordion-title">Test 2</h3> 
    <div class="uk-accordion-content">Everything else</div> 

    <h3 class="uk-accordion-title">Test 3</h3> 
    <div class="uk-accordion-content">All the rest</div> 

</div> 
</body> 
</html> 

コードを削減し、それが動作しません。

私はUIKitとjqueryの異なるバージョンを試しました...効果はありません。 jsbin(http://jsbin.com/fusapomoze)上

この例ではまた、

が動作していないhttps://getuikit.com/docs/accordion.html上のドキュメントは、それがどのように動作するかを示しています...

答えて

0

これは、ドキュメントが非常に明確ではありません

あまりにも簡単でした実際のところ、あなたのHTMLの先頭に(いくつかの)コンポーネントを追加する必要があります。

<link rel="stylesheet" href="css/uikit.min.css" /> 
<link rel="stylesheet" href="css/components/accordion.min.css" /> 
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
<script src="js/uikit.min.js"></script> 
<script src="js/components/accordion.min.js"></script> 
0

同じ問題が...私は答えを見つける:)

あなたのページにアコーディオンコンポーネントを読み込む必要があります。 JS Binの例では、の下に<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/accordion.min.js"></script>の行を追加します。

だから、それは動作します:)

も参照してください、あなたが与えているドキュメントのページのソースコードを、あなたは;-)

が、それはあなたを助けることを願っていますトリックがあります。

+0

あなたは私の答えの前にそれを見つける! ;-) – Karvindo

関連する問題