Добрый день. Столкнулся с проблемой карусели на jquery.
Вот CSS карусели:
.horizontal {width: 824px; height: 128px; position: absolute; margin: -417px 0 0 137px;}
.horizontal .carousel {width: 824px; height: 128px; position: absolute; margin: 247px 58px 43px -58px;}
.horizontal .carousel_container {width: 824px; height: 128px; overflow: hidden; position: relative;}
.horizontal ul {width: 832px; height: 128px; margin: 0; padding: 0; border: 0; outline: 0;}
.horizontal ul li {width: 98px; height: 128px; display: block; overflow: hidden; float: left; margin-right: 6px !important; position: relative; margin: 0; padding: 0; /* outline: 0; */}
.horizontal ul li img {width: 90px; min-height: 122px; position: absolute;}
.horizontal ul li a {width: 90x; height: 122px; display: block; color: #fff;}
.horizontal ul li .inner {width: 90px; height: 122px; display: block; overflow: hidden; border: 3px solid #4596F2; border-radius: 1px;}
.horizontal ul li .caption {position: absolute; left: 0; width: 70px; height: 78px; display: none; overflow: hidden; background: url(/images/related.png) repeat; margin: 0 3px; padding: 24px 10px 20px 10px; font: 13px/12px 'Ubuntu Condensed', Arial, Helvetica, sans-serif; color: #FFF; line-height: 15px; text-align: center;}
.carousel_right, .carousel_left {position: absolute; z-index: 10; width: 61px; height: 69px; display: block; text-indent: -9999px; opacity: 0.0; -moz-opacity: 0.0; filter: alpha(opacity=0); -moz-transition: all 0.4s ease; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease;}
.carousel_left {top: 32px; left: -110px; height: 56px; width:38px; background: url(/images/carl.png);}
.carousel_right {top: 32px; right: -90px; height: 56px; width:38px; background: url(/images/carr.png);}
.carousel_left:hover {opacity: 1.0; -moz-opacity: 1.0; filter: alpha(opacity=100);}
.carousel_right:hover {opacity: 1.0; -moz-opacity: 1.0; filter: alpha(opacity=100);}
Код дизайна на странице:
<script type="text/javascript" src="/js/carousel.js"></script>
<script type="text/javascript">$(document).ready(function() {$('.carousel').elegantcarousel({delay:40,fade:300,slide:500,effect:'fade',orientation:'horizontal',loop: false,autoplay: false,time: 3000});});</script>
<div class="horizontal">
<div class="carousel">
<a class="carousel_prev carousel_left" href="">prev</a>
<div class="carousel_container">
<ul class="portfolio_items">$MYINF_10$</ul>
</div>
<a class="carousel_next carousel_right" href="">next</a>
</div>
</div>
Вот код информера:
<li class="visible_1"><div class="inner"><a href="$ENTRY_URL$"> <img src="$SCREEN_URL$" alt="" height="122"/> <span class="caption">$TITLE$</span></a></div></li>
|
| Раздел: |
Каталог сайтов |
| Тип данных: |
Материалы |
|
| Способ сортировки: |
Дата добавления материала D
|
| Количество материалов: |
30 |
| Количество колонок: |
1 |
В принципе она работает, но есть одно "НО". Пару раз перелистывает материал, потом не работает.
Помогите пожалуйста разобраться с этим.
Контент-модули
Продвижение сайта
Управление сайтом