具體的下載包，網上好像有很多，我只想說一下我在網站加這個效果時，遇到的一些問題。

給一個我用的下載包：http://www.cssrain.cn/article.asp?id=616

圖片顯示的頁面

?????如果你想哪個圖片有此效果就要給這個圖片的的鏈接加上rel屬性，否則不會有效果的哦，至于rel的值嗎，我隨便寫也可以用的，無論把圖片放在什么容器中，必須要有這個屬性的。

?????在顯示大圖時你會發現左下腳，顯示 "Showing image 1 from 1"，有兩個數字，這個是根據rel的值的來決定的，如果有多個相同的rel值，JQuery就會把這幾個相同rel的圖片列為一組，所以from后的數字就是這組成員數量啦。

?????每個圖片要加上鏈接,至于鏈接的目標，我測試是沒什么作用的，你必須要加title，這個是在現實打圖像時那個圖像名稱，如果你沒寫的話，就會出現undefind

?????樣式表中的有要顯示時候需要用到的樣式，你可以修改的。

?/*顯示的頁面背景色*/?

???#ImageBoxOverlay {
?BACKGROUND-COLOR: #ccc
}

/*最底部的背景色*/
#ImageBoxCaption {
?BACKGROUND-COLOR: #f4f4ec
}

/*顯示圖片區域的那個樣式*/
#ImageBoxContainer {
?WIDTH: 250px; HEIGHT: 250px; BACKGROUND-COLOR: #f4f4ec
}

/*圖片文字說明（也就是那個圖片鏈接的title）樣式，*/
#ImageBoxCaptionText {
?FONT-WEIGHT: bold; FONT-SIZE: 13px; PADDING-BOTTOM: 5px; COLOR: #000
}
#ImageBoxCaptionImages {
?MARGIN: 0px
}

/*鼠標移動到右邊時顯示的下張圖片的那個背景圖片*/
#ImageBoxNextImage {
?BACKGROUND-IMAGE: url(spacer.gif); BACKGROUND-COLOR: transparent
}

/*鼠標移動到左邊時顯示的上一張圖片的那個背景圖片*/
#ImageBoxPrevImage {
?BACKGROUND-IMAGE: url(spacer.gif); BACKGROUND-COLOR: transparent
}

/*鼠標移動到右邊時顯示的下張圖片的那個表示圖片*/
#ImageBoxNextImage:hover {
?BACKGROUND-POSITION: right top; BACKGROUND-IMAGE: url(/imagebox/next_image.jpg); BACKGROUND-REPEAT: no-repeat
}

/*鼠標移動到左邊時顯示的上一張圖片的那個表示圖片*/

#ImageBoxPrevImage:hover {
?BACKGROUND-POSITION: left bottom; BACKGROUND-IMAGE: url(/imagebox/prev_image.jpg); BACKGROUND-REPEAT: no-repeat
}

2009-4-17修正

在imagebox的使用過程，發現當鼠標移到有些圖片上面時候，不能顯示下一張和上一張的圖片，最后測試發現啊，imagebox 中的a標簽不能使用小寫的，只能使用大寫的A，呵呵 最近發現的。

轉載于:https://www.cnblogs.com/Longkin/archive/2008/10/24/1318938.html

總結

以上是生活随笔為你收集整理的jQuery插件---ImageBox的使用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。