Bootstrap Carousel链接不工作在Chrome



我正在为我的雇主建立一个网站http://graceindustries.com/gracetest

使用themesforest/envato中的Fat Catz模板构建,该模板使用Bootstrap 3.0.0。

我有我的旋转木马工作到动画和调整大小和所有的东西。但我的问题是与链接。

在ie浏览器中,链接工作正常。

在Google Chrome中,只有第一个carousel项目的链接工作正常,当我点击后续项目的链接时,什么也没有发生。

所讨论的旋转木马是所提供链接上最上面的旋转木马。

链接一直在工作,直到我为每个旋转木马项目添加了一个浮动图像。

下面是我的代码:
<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>

引导旋转木马的任何区域;这些区域的所有超链接都不能在chrome上工作。例如,幻灯片的左侧有链接,但不能正常工作,因为它们正好与幻灯片高度相反。现在试着把超链接放在幻灯片的大小高度以下,甚至在右边,但稍微低于幻灯片就可以了。我猜不出为什么会这样!

最新更新