中文(繁体)
實作類似Flash的超酷特效程式碼是用表格佈局的！這個特效是改成用DIV+CSS佈局實現的！
<style> *{font:normal normal 13px/1.5em "宋體"} dl{width:200px;float:left;} dd{margin:0;padding:0;line-height:1.8em;padding-left:3px ;} dd a{text-decoration:none;} img{float:left;} dd a:hover{color:#f00;} .first{width:20px;height:190px;border:1px solid #ccc;border- left:0;float:left;text-align:center;cursor:pointer;} .first0{width:68px;height:190px;border-left:1px solid #ccc;float:left;text-align:center;cursor :pointer;overflow:hidden;} .second{float:left;border:1px solid #ccc;display:none;"} </style> <script> function $(obj){ return document.getElementById(obj); } function showAds(n){ for(var i=0;i<6;i++){ if(n==i){ $("ads"+i).style.display="block"; }else{ $( "ads"+i).style.display="none"; } } } </script> <div> <!--part0--> <div class="first0" onmouseover="showAds('0')" ><img src="" title="" /></div> <div class="second" style="display:block;" id="ads0" ><img src="" title="" /> </div> <!--part1--> <div class="first" onmouseover="showAds('1')">美麗地圖</div> <div class="second" id="ads1" > < dl> <dd>[上海]典範造型緣於專業如果您總是先選擇髮型師，再選擇美髮店，那麼這…</dd> <dd><a href="#">·[廣州]奧龍堡運動起來</a></dd> <dd><a href="#">·[廣州]青鳥健身新時尚</a></dd> <dd><a href="#" >·[廣州]安索瑜珈釋放心靈</a></dd> </dl> <img src="" title="" /> </div> <!--part2--> <div class= "first" onmouseover="showAds('2')">非常食尚</div> <div class="second" id="ads2" > <dl> <dd>[上海]露納的"養命仙湯"進入露納餐廳，四處看看，不論是大廳還是包房…</dd> <dd><a href="#">·[上海]Pasti意菜香氣纏綿</a></dd > <dd><a href="#">·[上海]全羅道享辛辣樂趣</a></dd> <dd><a href="#">·[上海]印度小廚食之魅< /a></dd> </dl> <img src="" title="" /> </div> <!--part3--> <div class="first" onmouseover="showAds('3' )">最佳去處</div> <div class="second" id="ads3" > <dl> <dd>[上海]燕慕的江南旗袍今天為大家介紹的這家「燕慕」中裝訂製店，設在…</dd> <dd><a href="#">·[上海]溢香坊中國式性感</a></dd> <dd><a href="#" >·[上海]迷你韓國城新款春裝</a></dd> <dd><a href="#">·[上海]心樂坊飾品款撩人</a></dd> < /dl> <img src="" title="" /> </div> <!--part4--> <div class="first" onmouseover="showAds('4')">絕色美女</div > <div class="second" id="ads4" > <dl> <dd>Eve&Anna私人禮服訂製「每個女人的衣櫥裡，應該有一件真正屬於她的禮… </dd> <dd> <a href="#">·香若爾服裝的奢華禮遇</a></dd> <dd><a href="#">·麗多坊打造公主式新娘</a></dd > <dd><a href="#">·巴黎婚紗之漂亮新娘</a></dd> </dl> <img src="" title="" /> </div> <!-- part5--> <div class="first" onmouseover="showAds('5')">城市漫遊</div> <div class="second" id="ads5" > <dl> <dd>北京人12種新不文明現象咱們北京的隨地吐痰現象令許多外國人驚訝。記得…</dd> <dd><a href="#">·隱私！揭秘王小丫私生活照</a></dd> <dd><a href="#">·北京12個盜車賊最愛光顧地</a></dd> <dd><a href=" #">·正在被北京拋棄的北京人</a></dd> </dl> <img src="" title="" /> <!--part 5 end--> </div> < /div>
