Question

我正在http://graceindustries.com/gracetest

为我的雇主建立一个网站

它使用来自themesforest / envato的Fat Catz模板构建，该模板使用Bootstrap 3.0.0。

我的旋转木马就像动画和调整大小一样工作，所有这些都是如此。但我的问题在于链接。

在Internet Explorer中，链接工作正常。

在谷歌浏览器中，只有第一个轮播项目的链接正常工作，当我点击后续项目时没有任何反应。链接。

有问题的轮播是所提供链接中最重要的轮播。

链接正常工作，直到我为每个轮播项目添加浮动图像。

这是我的代码：

<div class="owl-carousel" id="homeCarousel">
    <div class="item">
        <img style="float:right" style="vertical-align:top" alt="" src="images/portfolio/products/tpass3.png" width="30%" height="auto" class="img-responsive">
        <h2>Lone Worker Safety Solutions</h2>

        <h3>PASS Alarms, Monitoring Systems, & Evacuation Systems</h3>
        <a href="loneworker.html" class="btn btn-sm">
            <i class="icon-right-open-mini"></i> read more
        </a>

    </div>
    <div class="item">
        <img style="float:right" style="vertical-align:top" alt="" src="images/portfolio/products/cskit.png" width="30%" height="auto" class="img-responsive">
        <h2>Confined Space Worker Safety</h2>

        <h3>Featuring Our TPASS® 3 Telemetry Kit for Confined Spaces</h3>
        <a href="confinedspace.html" class="btn btn-sm">
            <i class="icon-right-open-mini"></i> read more
        </a>

    </div>
    <div class="item">
        <img style="float:right" style="vertical-align:top" alt="" src="images/portfolio/products/gwatch.png" width="30%" height="auto" class="img-responsive">
        <h2>Firefighter Safety</h2>

        <h3>Affordable Firefighter Accountability Systems</h3>
        <a href="firefighter.html" class="btn btn-sm">
            <i class="icon-right-open-mini"></i> read more
        </a>

    </div>
    <div class="item">
        <img style="float:right" style="vertical-align:top" alt="" src="images/portfolio/products/ltg.png" width="30%" height="auto" class="img-responsive">
        <h2>Personal Safety Lighting</h2>

        <h3>For Mining, Aviation, Police, and Search & Rescue</h3>
        <a href="lightsafety.html" class="btn btn-sm">
            <i class="icon-right-open-mini"></i> read more
        </a>

    </div>
    <div class="item">
        <img style="float:right" style="vertical-align:top" alt="" src="images/portfolio/products/ms1k-glow.png" width="30%" height="auto" class="img-responsive">
        <h2>Prevention Evacuation Systems</h2>

        <h3>Featuring our MS1000X</h3>
        <br>
        <a href="prevention.html" class="btn btn-sm">
            <i class="icon-right-open-mini"></i> read more
        </a>

    </div>
</div>
</div>

Answer 1

无论是自举旋转木马的哪个区域;取这些区域中的所有超链接都不适用于chrome。例如，幻灯片放映的左侧有链接，因为它们与幻灯片高度完全相反，所以无法正常工作。现在尝试将超链接放在幻灯片放映的大小高度之下，即使在右侧，但在幻灯片放映的下方也是如此。为什么会发生我无法猜测！

Bootstrap Carousel链接在Chrome中不起作用

1 个答案: