jQuery Cycle每个幻灯片上的全宽度包装

我正在使用jQuery Cycle进行幻灯片放映，并在主内容区域为背景添加了样式化图像。我正在将该图像淡化为纯色。纯色将跨越页面的整个宽度。颜色是在CMS中动态编写的。 CMS将颜色的类名称添加到Cycle影响的容器（li）中。周期重置我的所有布局？有没有人做过这个？
jQuery Cycle每个幻灯片上的全宽度包装

这就是我想要的造型看起来（不循环）： http://riverdistrictstudio.com/slider/index-no-cycle.html

随着周期： http://riverdistrictstudio.com/slider/

来源

2012-03-26 Scott Simpson

我找到了一个JS解决方案：http://www.yelotofu.com/2011/06/jquery-cycle-and-fullscreen/ - 一个CSS解决方案会更好，但也许这是不可能的。 – 2012-03-26 21:16:32

我认为原因在于该循环将你的'li'元素设置为'position：absolute'，这使得它们缩小了包装。您需要明确地将宽度设置为100％。 – powerbuoy 2012-03-26 21:29:32

周期插件contrains幻灯片他们最小的尺寸，使它们绝对所以可以通过彼此淡入。

的方式你仍然可以把它横跨整个宽度是包装一个div角落找寻ul和风格，使其width: 100%;并给UL margin: 0 auto;使其居中在div。

来源

2012-03-26 21:36:05 sg3s

居中不是问题。问题是全宽度包装的背景颜色需要与固定宽度的内容宽度相同时动画bg图像。 – 2012-03-27 01:02:54

在这种情况下，您需要修改Cycle插件，以免强制高度和宽度。或者使用另一个插件或自己写，淡入淡出过渡是最简单的方法。 [这是我的]（http://jsfiddle.net/RFJMy/222/），我专门为此写了它，没有额外的定位或强制尺寸。 – sg3s 2012-03-27 05:58:11

jQuery Cycle每个幻灯片上的全宽度包装

回答

相关问题