在背景圖像頂部淡入淡出幻燈片，作爲頁面背景

我的網站當前有一個大的靜態圖像作爲背景圖像。我想在背景圖片上添加3張圖片的循環幻燈片，但仍然低於其他所有內容。幻燈片放映圖像只是部分透明的不同大小的白色png，並且應該平滑地淡入對方。預期的效果是不斷突出顯示背景圖像的不同區域（頁面的其餘部分不會受到影響）。在背景圖像頂部淡入淡出幻燈片，作爲頁面背景

我必須添加到我的CSS文件以將幻燈片放在背景圖片上方，但是放在其他所有東西下方？目前，對於單個圖像，我有：

body { 
background-color: #000000; 
background-image:url('/images/wallpaper.jpg'); 
background-attachment:fixed; 
background-repeat:no-repeat; 
background-position:top center; 
color: #555; 
font: 70%/1.5 Verdana, 'Trebuchet MS', arial, sans-serif; 
text-align: center; 
margin: 15px 0; 
}

我發現褪色的圖像jQuery的應用程序（Innerfade），我需要什麼添加到我的我的網頁的身體來運行它，或者將一切從工作CSS？

謝謝任何幫助！

來源

2011-03-16 James

試用CSS：'position'和'z-index'。 – 2011-03-16 06:36:36

您需要定位具有不同z-索引的元素。例如

#slideshow{ 
position: relative; 
z-index: 1; 
} 

#otherContent{ 
position: relative; 
z-index: 2 
}

是需要的位置z索引工作。現在幻燈片放映與其他內容相比，z-index（空間深度）較低。

希望這會有所幫助。

來源

2011-03-16 07:29:56 jmartsch

謝謝，這看起來像我所需要的。 – James 2011-03-16 08:35:48

你應該「檢查」他的答案。 – mattsven 2011-03-16 09:10:17

嗯，好東西你說motionman95，當用一張簡單的圖片而不是幻燈片進行測試時，它並沒有把它放在其他所有東西的後面，而是放在頁面上的所有其他東西之後，就像是一種橫幅。這是否與'職位'有關？還是有另一個標籤，我需要補充說，把它放在所有其他元素？ – James 2011-03-16 10:19:45

在背景圖像頂部淡入淡出幻燈片，作爲頁面背景

回答

相關問題