单击时带有打开图像的轮播 [英] Carousel with open image on click

问题描述

我需要一个特定的轮播图，例如，从 10 个可见的幻灯片中包含 4 个，您可以滚动浏览它们中的每一个.当您点击拇指时，它会在顶部打开图像.

I need a specific carousel that have, for example, 4 visible slides from 10 and you can scroll through each of them. When you click on thumb, it opens image on top.

下面是一张图片:

我使用了很多滑块，但没有找到我要找的东西.

I used lots of sliders but did not found what i am looking for.

推荐答案

您可以将 Carousel 设置为背景图像中的容器，然后在单击其中一张图片时使用一些 jquery 更改背景图像.

You could give the container the Carousel is in a background image then use some jquery to change the background image when one of the pictures is clicked.

用

<a href="javascript:;" id="img1"></a>

然后使用jquery

$('#img1').on('click', function() {
    $('#changeMe').css('background-image', 'url(bg1.jpg)');
})

终于在css中

#changeMe {
    background-image: url(bg1.jpg);
    background-repeat: no-repeat;
}

编辑见http://www.bootply.com/PCAYskJ3Tl 快速示例

这篇关于单击时带有打开图像的轮播的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！