Home >Web Front-end >JS Tutorial >jquery mouse sliding display details application example_jquery

jquery mouse sliding display details application example_jquery

PHP中文网
PHP中文网Original
2016-05-16 17:02:32924browse

The effect is as follows:
jquery mouse sliding display details application example_jquery
The code implemented is very small and very concise, you can refer to and learn

Copy the code The code is as follows:




Copy Code The code is as follows:


<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>

 

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn