首页>>Jquery图片>>纯css lightbox 鼠标经过显示隐藏层 点击放大图片带标题(2015-04-05)

纯css lightbox 鼠标经过显示隐藏层 点击放大图片带标题

纯css lightbox 鼠标经过显示隐藏层 点击放大图片带标题
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

XML/HTML Code
  1. <section>  
  2.                 <ul class="lb-album">  
  3.                     <li>  
  4.                         <a href="#image-1">  
  5.                             <img src="../dandong.png" alt="image01" width="150" height="150">  
  6.                             <span>aihym.com</span>  
  7.                         </a>  
  8.                         <div class="lb-overlay" id="image-1">  
  9.                             <a href="#page" class="lb-close">x Close</a>  
  10.                             <img src="../dandong.png" alt="image01" />  
  11.                             <div>  
  12.                                 <h3>http://www.aihym.com</h3>  
  13.                                 <p>爱薅羊毛</p>  
  14.                             </div>  
  15.                               
  16.                         </div>  
  17.                     </li>  
  18.                     <li>  
  19.                         <a href="#image-3">  
  20.                             <img src="../dalian.jpg" alt="image03" width="150" height="150">  
  21.                             <span>爱薅羊毛</span>  
  22.                         </a>  
  23.                         <div class="lb-overlay" id="image-3">  
  24.                             <img src="../dalian.jpg" alt="image03" />  
  25.                             <div>                             
  26.                                 <h3>爱薅羊毛</h3>  
  27.                                 <p>http://www.aihym.com</p>  
  28.                             </div>  
  29.                             <a href="#page" class="lb-close">x Close</a>  
  30.                         </div>  
  31.                     </li>  
  32.   
  33.                   
  34.                       
  35.                 </ul>  
  36.             </section>  

 


原文地址:http://www.freejs.net/article_jquerytupiantexiao_460.html