網站首頁沒有一點動畫怎麼可以，我以前用過Flash As3做過圖片切換，效果非常不錯，可是麻煩，改變起來麻煩。一直想自己做個圖片切換效果，總認為比較麻煩，今天自己實踐了一下，其實還比較簡單。不過有個小問題，IE8不相容模式下 設定有透明效果的div 樣式添加失效了，但是我用谷歌，IE8兼容測試都ok。
反正是給自己記錄的，也不多話了，js沒有跟頁面分離，也沒有做出插件。一個網站要不了幾個這種效果，先實現了再說吧。最後的效果還是很高大上的。
頁 JS代碼
ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
http://www.w3.org/1999/xhtml">
圖片切換
頭>
8 7
地
3
title="2" onclick="返回 picChange(2)">2
onclick=" return picChange(1)" class="">1
身體>
css 的實作
複製程式碼程式碼如下：
.picMain
{
邊距：自動；
溢位：隱藏；
寬度：1000px；
高度：400px；
位置：相對；
}
.picimg
{
寬度：10000px；
高度：400px；
背景顏色：#000000;
位置：絕對；
上方：0px;
}
.pic備註
{
位置：絕對；
寬度：500px；
高度：50px；
底部：0px;
左：0px；
顏色：#FFFFFF；
文字縮排：2em;
}
.pic備註
{
顏色：#FFFFFF；
文字裝飾：無；
}
.pic備註a：懸停
{
文字修飾：底線；
}
.picaction
{
位置：絕對；
寬度：1000px；
高度：50px；
背景顏色：#000000;
過濾器：alpha(不透明度=50);
-moz-不透明度：0.5；
不透明度：0.5；
溢位：自動；
底部：0px;
左：0px；
文字對齊：右；
}
.picaction a
{
邊框：1px實線#C0C0C0;
寬度：30px；
高度：30px；
浮動：右；
行高：30px；
文字裝飾：無；
文字對齊：居中；
顏色：#FFFFFF；
字體粗細：粗體；
上邊距：10px；
顯示：塊；
右距：10px；
}
.pic
{
寬度：1000px；
高度：400px；
浮動：左；
}
.picselect
{
背景顏色：#919191;
}
以上就是本文的全部內容了，實現的功能很實用，希望大家能夠喜歡。
