Показать сообщение отдельно
  #3 (permalink)  
Старый 01.05.2015, 14:27
Аспирант
Отправить личное сообщение для Dark Surv Посмотреть профиль Найти все сообщения от Dark Surv
 
Регистрация: 16.03.2015
Сообщений: 43

вообщето оно на JQuery сделано - вот плагин - http://web-esse.ru/example/sliders/const_carousel.js
а вот пример использования(не забудьте подключить JQuery)

<script src='jquery-2.1.3.js'></script>
<script src='const_carousel.js'></script>
<link rel="stylesheet" href="carousel.css"/>
<script>
jQuery(document).ready(function () {
	jQuery("#carousel_const").carousel_const();
});
</script>

<div id="carousel_const">
		<div class="wrapper">
		<div class="gallery" style="width: 640px;">
			<div class="gallery-item" style="left: 207px;">
			<span class="gallery-icon">
				<a href="http://web-esse.ru/wp-content/uploads/2011/05/slide.jpg" title="slide"><img width="150" height="150" src="http://web-esse.ru/wp-content/uploads/2011/05/slide-150x150.jpg" class="attachment-thumbnail" alt="slide" title="slide"></a>
			</span></div>
			<div class="gallery-item" style="left: 367px;">
			<span class="gallery-icon">
				<a href="http://web-esse.ru/wp-content/uploads/2011/05/slide2.jpg" title="slide2"><img width="150" height="150" src="http://web-esse.ru/wp-content/uploads/2011/05/slide2-150x150.jpg" class="attachment-thumbnail" alt="slide2" title="slide2"></a>
			</span></div>
			<div class="gallery-item" style="left: -113px;">
			<span class="gallery-icon">
				<a href="http://web-esse.ru/wp-content/uploads/2011/05/slide3.jpg" title="slide3"><img width="150" height="150" src="http://web-esse.ru/wp-content/uploads/2011/05/slide3-150x150.jpg" class="attachment-thumbnail" alt="slide3" title="slide3"></a>
			</span></div>
				<div class="gallery-item" style="left: 47px;">
			<span class="gallery-icon">
				<a href="http://web-esse.ru/wp-content/uploads/2011/05/slider1.jpg" title="slide3"><img width="150" height="150" src="http://web-esse.ru/wp-content/uploads/2011/05/slide3-150x150.jpg" class="attachment-thumbnail" alt="slide3" title="slide3"></a>
			</span></div>
		</div>
		</div><a href="#" class="arrow back">&lt;</a><a href="#" class="arrow forward">&gt;</a>
</div>

а стиль carousel.css лежит на то й же странице ( http://web-esse.ru/example/sliders/carousel.html )
Ответить с цитированием