Я работаю над веб-сайтом, который использует CarouFredSel для отображения вертикальной прокрутки (http://new.joshrodg.com/?page_id=206), проблема, с которой я сталкиваюсь, заключается в том, что когда я нажимаю предыдущую кнопку, CarouFredSel отлично прокручивается... но когда я пытаюсь продвинуть слайд-шоу, нажимая следующую кнопку, прокрутка сбивается .... и странно то, что это происходит только тогда, когда я публикую карту Google с помощью плагина WordPress MapPress.
Я почти уверен, что плагин MapPress вызывает проблему, но я думаю, что с помощью некоторого кода это можно исправить (тем более, что кажется, что это проблема только для Safari... Я тестировал его в Safari, Firefox, Chrome и IE8)
Теперь одна вещь, которая работала (несколько), заключалась в добавлении position: relative
к моему .sidebar-image a
стилю css, единственная проблема с этим заключается в том, что, хотя он продвигается правильно, нет эффекта прокрутки (что противоречит цели)
Кто-нибудь когда-нибудь испытывал это раньше?
Мой script
выглядит так:
$(window).load(function() {
/* Sidebar */
$("#sidebar-image").carouFredSel({
direction: "up",
auto: false,
items: {
visible: 2
},
next: "#down",
prev: "#up",
scroll: {
easing: "quadratic",
items: 1
},
width: "100%"
});
});
Мой code
выглядит так:
<div class="sidebar-image">
<div id="sidebar-image">
<?php while ( have_posts() ) : the_post(); ?>
<?php if ( has_post_thumbnail() ) { ?>
<?php
$id = get_post_thumbnail_id();
$url = wp_get_attachment_image_src($id, "large", true);
?>
<a href="<?php echo $url[0]; ?>" rel="lightbox[<?php echo get_the_ID(); ?>]"><?php the_post_thumbnail("sidebar-image"); ?></a>
<?php } ?>
<?php endwhile; ?>
</div>
<div class="clear">
<!-- -->
</div>
</div>
и мой CSS
выглядит так:
/* Slides */
.sidebar-image {
border-bottom: 1px solid #dcdedf;
overflow: hidden;
width: 277px;
}
.sidebar-image a {
border-left: 1px solid #dcdedf;
border-right: 1px solid #dcdedf;
border-top: 1px solid #dcdedf;
display: block;
position: relative;
float: left;
}
Весь этот код находится в другом div, который имеет относительное положение - я где-то читал, что это может вызвать проблему, но даже после удаления css карусель по-прежнему делает то же самое...
code
для содержащего div выглядит так:
/* Slideshow */
#sidebar {
float: right;
position: relative;
width: 305px;
}
Я пробовал использовать другую библиотеку jQuery (прямо из jQuery, а не прямо из Google). Я также пытался использовать полный сценарий CarouFredSel, а не упакованную версию CarouFredSel.
Есть идеи? Это поставило меня в тупик :-(
Спасибо,
Джош