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每個幻燈片上的全寬度包裝

回答

相關問題