jquery 鼠标滑动显示详情应用示例_jquery

效果如下图：
 
实现的代码很少，很简洁，可参考学习

复制代码 代码如下:

复制代码 代码如下:

<p style="border-left: none" class="module-box1 orangeback show_box1">

 <dl> <br><p class="module-tit"> <br><span class="store-name">好评度排名</span> <br></p> <br><p> <br><dd style="padding: 15px 0 10px 15px" class="phover"> <br><em class="current">1</em><img class="jiupic" src="images/jiu.gif" width="100" height="100" /> <br><span class="pname"><a href="#" target="_blank">五粮液</a> </span><span class="pinpingzhe">品评评分：</span><span class="fenshu">8.6分</span> <br><p class="jindu"><span class="jindutiao"><em class="fen0"></em></span></p> <br></dd> <br><dd class="show_box_dd" style="display: none;"> <br><em>1</em><a href="#" target="_blank">五粮液</a><span class="rank">9分</span> <br></dd> <br></p> <br><p> <br><dd style="padding: 15px 0 10px 15px; display: none;" class="phover"> <br><em class="current">2</em><img class="jiupic" src="images/jiu.gif" width="100" height="100" /> <br><br><span class="pname"><a href="#" target="_blank">泸州老窖</a> </span><span class="pinpingzhe">品评评分：</span><span class="fenshu">8.6分</span> <br><p class="jindu"><span class="jindutiao"><em class="fen0"></em></span></p> <br></dd> <br><dd class="show_box_dd"> <br><em>2</em><a href="#" target="_blank">泸州老窖</a><span class="rank">9分</span> <br></dd> <br></p> <br><p> <br><dd style="padding: 15px 0 10px 15px; display: none;" class="phover"> <br><em class="current">3</em><img class="jiupic" src="images/jiu.gif" width="100" height="100" /> <br><br><span class="pname"><a href="#" target="_blank">金六福</a> </span><span class="pinpingzhe">品评评分：</span><span class="fenshu">8.6分</span> <br><p class="jindu"><span class="jindutiao"><em class="fen0"></em></span></p> <br></dd> <br><dd class="show_box_dd"> <br><em>3</em><a href="#" target="_blank">金六福</a><span class="rank">9分</span> <br></dd> <br></p> <br><br><br></dl> <br></p>