Перемешка

Перемешайте кадры, добавив data-shuffle="true".

Для работы примера ниже необходим следующий код:

 <style>
 .switch {
 border-bottom: 1px dashed;
 cursor: pointer;
 }

 .fotorama-with-numbers .fotorama__html div {
 background-color: #fff;
 width: 2em;
 height: 2em;
 text-align: center;
 line-height: 2em;
 border-radius: 1em;
 box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
 position: absolute;
 top: 1em;
 left: 1em;
 }
</style>

<script>
 $(function () {
 var $fotorama = $('#shuffle-fotorama'),
 fotorama = $fotorama.data('fotorama');
 $('#shuffle').on('click', fotorama.shuffle);
 });
</script>

<p>
 <span class="switch" id="shuffle"><i class="icon-random"></i>Перемешать</span>
</p>

<!-- Fotorama -->
<div class="fotorama fotorama-with-numbers"
 id="shuffle-fotorama"
 data-shuffle="true"
 data-width="658"
 data-ratio="3/2"
 data-fit="cover"
 data-loop="true">
<div data-img="/images/1.jpg">1</div>
<div data-img="/images/2.jpg">2</div>
<div data-img="/images/3.jpg">3</div>
<div data-img="/images/4.jpg">4</div>
<div data-img="/images/5.jpg">5</div>
<div data-img="/images/6.jpg">6</div>
<div data-img="/images/7.jpg">7</div>
<div data-img="/images/8.jpg">8</div>
<div data-img="/images/9.jpg">9</div>
<div data-img="/images/10.jpg">10</div>
</div>

Пример перемешивания:

Перемешать