我正在使用bxslider为单个记录调用图像
滑块工作正常,我将其设置为通过与特定记录相关的图像自动翻页,但是我在将缩略图链接到滑块时出现问题。
目前,如果我点击滑块下方的缩略图,它会将图像加载到灯箱中(如果这是正确的术语),而不是将滑块移动到相关图像。
以下是我正在使用的代码,我们将不胜感激 谢谢 - 梅尔
<div> <script type="text/javascript">
$(document).ready(function(){
$('.bxslider').bxSlider({
mode: 'fade',
captions: 'false',
auto: 'true',
autoControls: 'true',
});
});
</script>
<ul class="bxslider list-unstyled"><?php foreach($images as $key=>$image) { ?>
<li class="img-responsive list-unstyled"><img src="<?php echo $image ['image']; ?>" /></li><?php } ?>
</ul></div>
<div id="bx-pager">
<div class="row">
<?php foreach($images as $key=>$image) { ?>
<div class="col-md-3 col-sm-4 col-xs-6 bx-pager">
<a class="image_group thumbnail" rel="image_group" href="<?php echo $image['image']; ?>" title="<?php echo $this->escape($image['title']); ?><?php if($image['description']) { ?> - <?php } ?><?php echo $this->escape($image['description']); ?>">
<img src="<?php echo $image['thumb']; ?>" alt="<?php echo $this->escape($image['title']); ?><?php if($image['description']) { ?> - <?php } ?><?php echo $this->escape($image['description']); ?>">
</a>
</div>
<?php } ?>
</div>
</div>