Question

所以我从this template创建了网站，最近我发现旋转木马没有自动滑动，除了我首先点击上一个或下一个按钮。

我已经检查过这个模板的javascript，除了调整时间外没有找到任何与此轮播相关的内容。

我只是不能让这个旋转木马继续骑自行车当我把鼠标放在旋转木马里面时，我试图使用暂停选项但不能正常工作

我的旋转木马也只包含图片，所以我想添加<a href='#'>来扭曲我的图像，这样当用户点击旋转木马图像时，它会将它们引导到我已准备好的链接......

Answer 1

In your main.js file put a space in between the #main-slider and .carousel right now it looks like this:

//#main-slider
$(function(){
    $('#main-slider.carousel').carousel({
        interval: 8000
    });
});

And it should look like this:

//#main-slider
$(function(){
    $('#main-slider .carousel').carousel({
        interval: 8000
    });
});

If you are not going to have anything in your carousel and want a <a> tag in there you could just put it in the item and then position it absolutely so it overlays the entire item. You will want to set the z-index to -1 so you can still use your carousel controls like so:

Html:

<div class="item active" style="background-image: url('http://sm-trust.com/imagesartikel/v0KO6zeQfA2016-01-29n.jpg')">
<a href="first.html"></a>
</div>
<div class="item" style="background-image: url('http://sm-trust.com/imagesartikel/8fXdR35LuO2016-01-29n.jpg')">
<a href="second.html"></a>
</div>

Css:

#main-slider .item a {
  position: absolute;
  top: 0;left: 0;right: 0;bottom: 0;
  z-index: -1;
}

Here is a fiddle of it working Fiddle

引导旋转木马表现得很奇怪

1 个答案: