自動で画像がループするスライドショーを作りたい

自動で画像がループするスライドショーを作りたいです。

実装したいこと。
・左送り
・無限ループ
・画像の切り替わりスピードが１秒
・画像の表示時間５秒
・レスポンシブ対応(ウィンドウ幅に合わせた画像表示)

UIkitを使って実装を試みているんですが、スライドショー自体が機能しません。
単純にimg要素として読み込まれて、sample1のみ、画像が表示されるんですが、どうしたらスライドショーの機能が働くでしょうか？

html
1<head>
2<!-- UIkit CSS -->
3<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.2.3/dist/css/uikit.min.css" />
4
5<!-- UIkit JS -->
6<script src="https://cdn.jsdelivr.net/npm/uikit@3.2.3/dist/js/uikit.min.js"></script>
7    
8<script src="https://cdn.jsdelivr.net/npm/uikit@3.2.3/dist/js/uikit-icons.min.js"></script>
9
10</head>
11<body>
12<div uk-slideshow="{autoplay: true}">
13        <ul class="uk-slideshow-items">
14            <li>
15    <img src="img/sample.jpg" alt="sample">
16            </li>
17            <li>
18    <img src="img/sample2.jpg" alt="sample2" uk-cover>
19            </li>
20        </ul>
21</body>

css
1.uk-slideshow-items img{
2    width:100%;
3}

参考サイト
getUIkit

補足：UIkit自体が読み込まれていないのかと思い、UIkitを使って簡単なテキストの装飾をしてみたら表示できました。

行動規範の内容に同意します

回答1件

ベストアンサー

HTML
1<div uk-slideshow="{autoplay: true}">
2```↓
3```HTML
4<div uk-slideshow="autoplay: true">
5<!-- 中略 -->
6</div>
7```**動くサンプル：**[https://jsfiddle.net/hsL9axgw/](https://jsfiddle.net/hsL9axgw/)

投稿2019/11/16 16:33