[問題] 試做廣告旋轉木馬效果

看板Web_Design作者 (小綿羊趕集)時間11年前 (2014/09/22 14:46), 編輯推噓3(307)
留言10則, 6人參與, 最新討論串1/2 (看更多)
我要試做一個廣告旋轉木馬的效果 目前先用css再排板,但卻遇到一個問題 我的效果是這樣的,一組推薦模組有四張圖片當滑鼠移過 最右邊的圖片會出現next的箭頭圖片,最左邊則會有prev的箭頭圖片作為btn 因為必須要將箭頭圖片壓在推薦的圖片上面 所以我在推薦圖片的wrap下了position:absolute;這樣箭頭才可以壓在上層 但是因為下了position:absolute;之後下方的footer就會無視推薦模組的高度 不會排序在推薦模組下,變成footer與推薦重疊 有什麼方法可以解決這樣的狀況讓footer會排序在推薦後面呢? 以下是我的code,謝謝各位高手 http://jsfiddle.net/y1hysheh/ -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 59.124.108.82 ※ 文章網址: http://www.ptt.cc/bbs/Web_Design/M.1411368381.A.331.html

09/22 18:56, , 1F
圖片404阿...根本看不懂
09/22 18:56, 1F

09/23 01:40, , 2F
我是後端工程師,但是這種前端工作我也做N次了
09/23 01:40, 2F

09/23 08:23, , 3F
clear:auto或hidden
09/23 08:23, 3F

09/23 11:10, , 4F
要放在後面的元素設定clear: both就可以了
09/23 11:10, 4F

09/23 11:10, , 5F
不過通常該區塊會先用一塊div包起來並且設定
09/23 11:10, 5F

09/23 11:11, , 6F
position: relative
09/23 11:11, 6F

09/23 11:11, , 7F
再在該區塊進行其他設定,就不會影響到後面的區塊
09/23 11:11, 7F

09/23 14:13, , 8F
原來這個中文叫旋轉木馬
09/23 14:13, 8F

09/23 15:37, , 9F
其實有好多種說法耶!就連英文也有各家自己的名稱
09/23 15:37, 9F

09/23 20:17, , 10F
基本上都叫carousel
09/23 20:17, 10F
文章代碼(AID): #1K7yMzCn (Web_Design)
文章代碼(AID): #1K7yMzCn (Web_Design)