我正在尝试将Orbit用作照片的转盘。我的问题是,因为我有成千上万张不同宽度的图像,所以我需要看到几张图像一起完成整个屏幕的宽度,而不是一张图像。
我尝试将项目符号用作幻灯片,但由于它们是固定的,因此无法使用。
<div class="orbit" role="region" aria-label="carusel" data-orbit>
<div class="orbit-wrapper">
<div class="orbit-controls">
<button class="orbit-previous"><img src="img/bbth-arrowprev.png" alt="" /></button>
<button class="orbit-next"><img src="img/bbth-arrownext.png" alt="" /></button>
</div>
<!--<ul class="orbit-container">
<li class="orbit-slide is-active"><figure class="orbit-figure"><img src="upload/pfizer-01.jpg" alt="" /></figure></li>
<li class="orbit-slide"><figure class="orbit-figure"><img src="upload/tira-01.jpg" alt="" /></figure></li>
<li class="orbit-slide"><figure class="orbit-figure"><img src="upload/tira-02.jpg" alt="" /></figure></li>
<li class="orbit-slide"><figure class="orbit-figure"><img src="upload/tira-03.jpg" alt="" /></figure></li>
</ul>-->
<nav class="orbit-bullets">
<button class="is-active" data-slide="0"><img src="upload/pfizer-01.jpg" alt="" /></button>
<button data-slide="1"><img src="upload/tira-01.jpg" alt="" /></button>
<button data-slide="2"><img src="upload/tira-02.jpg" alt="" /></button>
<button data-slide="3"><img src="upload/tira-03.jpg" alt="" /></button>
<button data-slide="4"><img src="upload/tira-04.jpg" alt="" /></button>
<button data-slide="5"><img src="upload/tapa-bazaar.jpg" alt="" /></button>
</nav>
</div>
</div>
我尝试使用Foundation外部的转盘,但是它在代码中产生了错误。