jquery - 浮动基本 jQuery 滑块

Question

我在我的网站上使用基本 jQuery 滑块 ( http://www.basic-slider.com )：http: //www.bizgamesstudios.com/

我的目标是将滑块浮动到左侧，以便下方的项目符号点与滑块并排站立。但是，当应用 float:left 时，滑块会折叠。

关于如何在不改变滑块外观的情况下执行此操作的任何想法？

谢谢

Answer 1

您的幻灯片设置了最大宽度，但没有设置实际宽度。一旦它向左浮动，您的#content 就不会考虑幻灯片的高度。

将#content 的高度、#slideshow 的宽度和#width 添加到您的功能列表中应该可以工作。

试试这个 CSS：

#slideshow {
    width: 600px;
    float: left;
    }

.featureList {
    width: 300px;
    float: left;
    }

#content {
    margin: 0 auto;
    padding: 25px 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.25);
    background: #fff;
    height: 600px;
    }

Answer 2

由于您的网站是固定宽度，您可以添加一个宽度并将其浮动：

.featureList {
    width: 530px;
    float: right;
}

此外，将 #slideshow 上的最大宽度更改为宽度：

#slideshow {
  width: 600px;
}

最后，您需要将 clearfix 类添加到#game1 div

Answer 3

将这些属性应用于 .featureList：

float: right;
margin-top: -300px;
margin-right: -80px;