我正在尝试构建响应式jQuery Cycle实现。我已经构建了布局,使其类似于2行2列表。第1列宽度为25%,height: auto
。第二行基本上有一个固定的高度。
第二列中的两个单元格独立循环,但似乎循环为一个元素(我不认为这是相关的,但我想彻底)
我遇到的问题是jQuery Cycle将position:absolute
(我理解为什么)添加到循环元素中;但是,我无法弄清楚为什么右上方列(第1行,第2列)的高度是这样的。
如果我用position:relative !important'
逼迫位置,我会得到必要的高度,但周期显然存在问题。
我尝试了cssBefore
,cssAfter
以及我能想到的各种风格组合,但无济于事。如果您查看下面引用的codepen,取消注释position:relative !important
将显示我最接近的。
我正在使用jQuery Cycle v 3.0.2。
您可以在http://codepen.io/chrisrockwell/pen/uafeD看到示例。如果您在 UNCOMMENT THE BELOW LINE 中搜索(在Windows上按CTRL + F),您将看到取消注释以强制显示该位置以及显示如何运行的内容。
另请注意,我已在codepen上禁用了自动运行,因此您需要点击JavaScript窗口上方的 RUN 来重新初始化循环。
感谢您的帮助!
答案 0 :(得分:0)
嗯......对您的代码进行了一些更改。看看这是否是您所需要的:http://codepen.io/adityadineshsaxena/pen/hvmro
CSS更改:
.left-top{
height: 365px !important;
}
.carousel-body {
color: cyan;
p {
padding-top: 0;
margin-top:5px;
margin-bottom:5px;
}
}