如何使 swiper.js 图像可点击？

Question

使用的滑块：http : //www.idangero.us/swiper/

我正在尝试的实时演示：http : //mhdtaki.com/lab/mobile/mobile.html

我已经实现了滑动图库，设置为仅通过媒体查询出现在移动大小的屏幕上。重点是在较小的视口上查看时将桌面网格库替换为 Coverflow 移动版本。调整演示页面的大小将显示成功显示的coverflow画廊，我想知道如何使图像可点击到外部链接，类似于较大的网格如何响应点击。我尝试用一​​个元素包装单个 div，但这只会破坏图库。

    <!--MOBILE GALLERY FOR VIEW -->
  <section id="mobilegallery">
                    <div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide" style="background-image:url(images/imperialthumb.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/lezem.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/pups.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/kanafani.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/unvield.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/baz.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/rana.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/chairs.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/brosh.jpg)"></div>
        <div class="swiper-slide" style="background-image:url(images/bros.jpg)"></div>
    </div>
    <!-- Add Pagination -->
</div>
    </section>
            <!--END MOBILE GALLERY FOR VIEW -->

我尝试的示例：

 <div class="swiper-wrapper">
            <a href="www.google.com"><div class="swiper-slide" style="background-image:url(images/imperialthumb.jpg)"></div></a>
        </div>

Answer 1

尝试这个

<div class="swiper-wrapper">
  <a class="swiper-slide" style="background-image:url(images/imperialthumb.jpg)" href="www.google.com"></a>
</div>

也许你需要添加

.swiper-slide {
  display: inline-block;
}

或者

.swiper-slide {
  display: block;
}