Автоматическая 3D галерея изображений через плагин Feature Carousel на jQuery
1 2 3 4 5 6 7 8 |
<link rel="stylesheet" href="/css/local.css" charset="utf-8" /> <script src="/js/jquery.featureCarousel.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> $(document).ready(function() { $("#carousel").featureCarousel({ }); }); </script> |
2#: Следующий код вставляйте в то место, где будет ваша галерея:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
<div id="carousel-container"> <div id="carousel"> <div class="carousel-feature"> <a href="#"><img class="carousel-image" alt="Image Caption" src="/images/image1.jpg"></a> <div class="carousel-caption"> <p> Описание к первой картинке </p> </div> </div> <div class="carousel-feature"> <a href="#"><img class="carousel-image" alt="Image Caption" src="/images/image2.jpg"></a> <div class="carousel-caption"> <p> Описание ко второй картинке. </p> </div> </div> <div class="carousel-feature"> <a href="#"><img class="carousel-image" alt="Image Caption" src="/images/image3.jpg"></a> <div class="carousel-caption"> <p> Описание к третьей картинке </p> </div> </div> <div class="carousel-feature"> <a href="#"><img class="carousel-image" alt="Image Caption" src="/images/image4.jpg"></a> </div> <div class="carousel-feature"> <a href="#"><img class="carousel-image" alt="Image Caption" src="/images/image5.jpg"></a> <div class="carousel-caption"> <p> Описание к пятой картинке </p> </div> </div> </div> <div id="carousel-left"><img src="/images/arrow-left.png" /></div> <div id="carousel-right"><img src="/images/arrow-right.png" /></div> </div> |