У меня есть установка vanilla flexslider на моем сайте. Ползунок работает, циклически перемещаясь по элементам списка в неупорядоченном списке. Вы можете добавлять заголовки, просто добавляя контейнер заголовков после элемента списка. Это хорошо работает с жестко закодированными изображениями.
Проблема, с которой я столкнулся, заключается в том, что на моем сайте есть несколько разделов с разными слайд-шоу для каждого раздела. Вместо жесткого кодирования элементов li я генерирую их с помощью php, так что, когда пользователь посещает страницу, php определяет, какую страницу просматривает пользователь, и передает ее в слайд-шоу. Затем слайд-шоу находит правильный каталог изображений и загружает все изображения в этом каталоге, будь то два или двадцать. Это намного проще, чем жестко кодировать каждое слайд-шоу, и работает прекрасно.
<?php
$dh = "image/slideShows/$slideShow/";
$images = glob($dh . "*.jpg");
foreach($images as $image){
?><li><img src="<?php echo $image;?>" alt="caption text" /></li><?php
}
closedir($dh);
?>
Мне нужно, чтобы flexslider читал замещающий текст для каждого динамически сгенерированного изображения, а затем помещал его в контейнер подписи:
<p class="caption">The alt text should show up here.</p>
Я пробовал использовать:
$(window).load(function() {
$('.flexslider').flexslider({
animation: "fade",
controlsContainer: "#slideShowContainer",
start: function(slider) {
$('.caption').html(this.alt);
},
});
});
и безрезультатно играл с current.slide flexslider. Я искал это всю ночь, и я не могу понять это. Я надеюсь, что кто-то здесь может предоставить недостающую ссылку для меня.
Заранее спасибо.
РЕДАКТИРОВАТЬ: я понял это, и это был серьезный вопрос чрезмерного усложнения. Все, что мне нужно было сделать, это вызвать данные EXIF, которые я использовал для атрибута «alt» внутри подписи. Я понятия не имею, почему мне потребовалось так много времени, чтобы понять это. Спасибо вам обоим за помощь!
li
? Вы также создаете тег заголовка p с помощью php? если нет, вы можете попробовать это внутри start:$(this).after('<p class=caption>'+this.alt+'</p>')
. В противном случае проверьте, чтоthis
внутри start - это то, что вы думаете. - person Thomas   schedule 26.06.2012console.log(this)
и открыв в браузере с помощью консоли (например, Chrome, нажав Ctrl + J, или Firefox с Firebug) - person Thomas   schedule 26.06.2012start: function(slider){console.log(this) }
, и он говорит мне, что селектор.slides li
, поэтому внутри запуска я запустил$('caption').append('<p class=caption>'+$(this).find('img').attr("alt")+'</p>');
вместе с несколькими различными способами его вызова и добавления, и моя подпись отображается как неопределенная. Я также пробовал src вместо alt, и я получаю тот же результат. - person Rob   schedule 26.06.2012.slides li
? является лиthis
строкой селектора, а не объектом? В любом случае, это не должно быть$(this).append(...)
? - person Thomas   schedule 26.06.2012