English
The code to implement cool special effects similar to Flash is laid out in a table! This special effect is implemented using DIV+CSS layout!
<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')">Beautiful map</div> <div class="second" id="ads1" > < dl> <dd>[Shanghai] Model styling is due to professionalism. If you always choose a hairstylist first and then a hair salon, then this...</dd> <dd><a href="#">·[Guangzhou] Get active in Aolongbao</a></dd> <dd><a href="#">·[Guangzhou] Jade Bird Fitness New Fashion</a></dd> <dd><a href="#" >·[Guangzhou] Ansuo Yoga releases the soul</a></dd> </dl> <img src="" title="" /> </div> <!--part2--> <div class= "first" onmouseover="showAds('2')">Very Food Fashion</div> <div class="second" id="ads2" > <dl> <dd>[Shanghai] Luna's "Yangmingxian" Tang "entered Luna Restaurant and looked around, whether it was the lobby or the private room...</dd> <dd><a href="#">·[Shanghai] The lingering aroma of Pasti Italian cuisine</a></dd > <dd><a href="#">·[Shanghai] Enjoy spicy fun in Jeolla-do</a></dd> <dd><a href="#">·[Shanghai] The charm of Indian small kitchen cuisine< /a></dd> </dl> <img src="" title="" /> </div> <!--part3--> <div class="first" onmouseover="showAds('3' )">The best place</div> <div class="second" id="ads3" > <dl> <dd>[Shanghai] Yanmu's Jiangnan Cheongsam Today I will introduce to you the "Yanmu" Chinese clothing store Customized shop, located in...</dd> <dd><a href="#">·[Shanghai] Yixiangfang Chinese Sexy</a></dd> <dd><a href="#" >·[Shanghai] Mini Korea Town’s new spring clothes</a></dd> <dd><a href="#">·[Shanghai] Xinlefang’s alluring accessories</a></dd> < /dl> <img src="" title="" /> </div> <!--part4--> <div class="first" onmouseover="showAds('4')">Stunning beauty</div > <div class="second" id="ads4" > <dl> <dd>Eve&Anna private dress customization "Every woman should have a gift that truly belongs to her in her wardrobe... </dd> <dd> <a href="#">·Luxury courtesy of Xiangruoer clothing</a></dd> <dd><a href="#">·Liduofang creates a princess-style bride</a></dd > <dd><a href="#">·Beautiful bride in Paris wedding dress</a></dd> </dl> <img src="" title="" /> </div> <!-- part5--> <div class="first" onmouseover="showAds('5')">City Roaming</div> <div class="second" id="ads5" > <dl> <dd>Beijinger 12 The spitting phenomenon in Beijing is a new uncivilized phenomenon that surprises many foreigners. Remember...</dd> <dd><a href="#">·Privacy! Revealing photos of Wang Xiaoya’s private life</a></dd> <dd><a href="#">·12 favorite places for car thieves in Beijing</a></dd> <dd><a href=" #">·Beijingers who are being abandoned by Beijing</a></dd> </dl> <img src="" title="" /> <!--part 5 end--> </div> < /div>
