Question

我遇到了jQuery bxSlider V4的问题：

jQuery bxSlider V4
选项： pagerCustom
没有标记的拇指图像（<a data-slide-index="x">）
thumb将动态添加jQuery标签

这个想法是，后台用户（CMS Joomla）不必手动插入所有链接：

这是我的 HTML ：

<div class="custom bxSliderMainContent">
    <img alt="wer 01" height="361" src="/images/werkstatt/gross/wer_01.jpg" width="537"/>
    <img alt="wer 02" height="361" src="/images/werkstatt/gross/wer_02.jpg" width="537"/>
    <img alt="wer 03" height="361" src="/images/werkstatt/gross/wer_03.jpg" width="537"/>        
</div>

和 pagerCustom 我在这里创建了这个：

<div class="custom bxSliderMainThumb">
    <img alt="wer 01" src="/images/werkstatt/klein/wer_01.jpg" height="57" width="57" />
    <img alt="wer 02" src="/images/werkstatt/klein/wer_02.jpg" height="57" width="57" />
    <img alt="wer 03" src="/images/werkstatt/klein/wer_03.jpg" height="57" width="57" />    
</div>

每张图片都缺少<a data-slide-index="x">，但是这些我用jQuery在每个元素的循环中创建：

nr = 0;
$(".bxSliderMainThumb img").each(function() {
    $(this).wrap('<a data-slide-index="' + nr + '" href="javascript:void(0);" class="icon">');
    nr++;
});

问题 - 在我看来 - 现在是，如果我现在调用滑块：

$(".bxSliderMainContent").bxSlider({
    mode : 'fade', 
    pager : false, 
    controls : false, 
    pagerCustom: '.bxSliderMainThumb'
});

在阅读上面的jQuery修改内容之后，他不理解，他必须这样做。

项目链接：http://voelserg.linux11.webhome.at/de/goldschmied-suedtirol.htm

任何人都可以帮我找到解决方案吗？会很棒

提前感谢您的帮助！

bxSlider无法识别pagerCustom选择器

0 个答案: