Ссылка на код и демо простого слайдера от Deff
Слайдер с автопрокруткой от sadhaka:
В объявление
<script src=http://forumstatic.ru/files/0011/e9/e1/27099.js></script> <style> #pun-announcement #slider { margin: 0 auto; } #pun-announcement #slides, #pun-announcement #control { display: inline-block; text-align: center; } #pun-announcement #slides { width: 400px; height: 260px; margin: 0; border: 1px solid black; } #pun-announcement #control { vertical-align: middle; } #pun-announcement #control a { display: inline-block; pointer: cursor; margin: 0 5px; width: 32px; height: 32px; padding-top: 5px; text-decoration: none; } #next{ background: url(http://www.iconsearch.ru/uploads/icons/kids/32x32/next-sail.png) no-repeat center center;} #prev{ background: url(http://www.iconsearch.ru/uploads/icons/kids/32x32/previos-sail.png) no-repeat center center;} #pun-announcement #control a:hover { }</style> <div id="slider"> <table style="height: 260px;"> <tr> <td id="control"><a href="#" id="prev"></a></td> <td id="slides"> <div> Блок 1 </div> <div> Блок 2 </div> <div> Блок 3 </div> <div> Блок 4 </div> </td> <td id="control"><a href="#" id="next"></a></td> </tr> </table> </div> <script> justSlider( $('#pun-announcement #slider'), { left: $('#pun-announcement #control #prev'), right: $('#pun-announcement #control #next'), auto: 1000 }); </script>
Если нужна автопрокрутка, задаете ее в этой части (число - скорость смены слайдов):
justSlider(
$('#pun-announcement #slider'),
{
left: $('#pun-announcement #control #prev'),
right: $('#pun-announcement #control #next'),
auto: 1000
});</script>
если нет, просто убираете совсем (вместе с запятой после последней опции).
Теги: слайдер,скрипт слайдера,стрелочки влево-вправо
Отредактировано Ichimaru Gin (11.03.2014 08:13:52)