эта хрень создает нарезку кадров к ролику в таком виде (см. второй атач)
возникла идейка замутить слайдер для этого чуда, ибо смотреть на нее мне не нравится XD
для начала демка и видюшка
подключение довольно простое, но обязательно указывать количество колонок и строк… это нужно для расчет))
…
<body>
<img src="img/sample.jpg" class="minis" rel="4,4" alt="" />
<img src="img/sample2.jpg" class="minis" rel="5,5" alt="" />
<img src="img/sample3.jpg" class="minis" rel="3,3" alt="" />
<img src="img/sample4.jpg" class="minis" rel="6,4" alt="" />
</body>
<script type="text/javascript">
$('.minis').jMinis({
cols: 4,
rows: 4
});
</script>
…если строк и столбцов везде одинаковое количество, то можно поставить параметром в плагин, если же на каждой картинке свое количество, то атрибутом rel фигачим в саму картинку… в случае примера везде будет 4 на 4, так как указано в плагине.
основные стили:
.jMinis { width:20px; height:20px; background:#000 url('img/miniload.gif') 50% 50% no-repeat; overflow:hidden; position:relative; }
.jMinis div { position:absolute; top:0; right:0; bottom:0; left:0; visibility:hidden; }
.jMinis img { position:absolute; visibility:hidden; }
.jMinis a { width:22px; height:92px; text-indent:-9999px; background:url('img/mininav.png') 0 0 no-repeat; margin-top:-46px; overflow:hidden; position:absolute; top:50%; right:-22px; }
.jMinis a:first-child { background-position:-22px 0; right:auto; left:-22px; }тут объяснять нечего))
доп параметры:
$('.minis').jMinis({
header: 80,
space: 10
});данный вариант подогнан именно под MPC, в других программах могут отличаться отступы… этими двумя параметрами можно изменить высоту шапки и отступы между кадрами… гарантий точности не даю))
плюс - одна картинка, быстро грузится, долго не надо заморачиваться с кадрами
минус - маленькие картинки
