圖片畫廊是web或者網(wǎng)站開發(fā)中經(jīng)常會用到的組件，非常適合作為圖片展示，個人作品展示和相冊使用。今天我們將介紹一個非常棒的基于HTML5的圖片畫廊 - Juicebox Lite，希望大家喜歡。

Juicebox Lite是基于HTML5的免費個人畫廊，可以幫助開發(fā)人員創(chuàng)建超酷的圖片畫廊，

主要特性

支持windows，Mac和Linux支持IE6+，F(xiàn)F3.6+，chrome，Safari和Opera支持移動手機/平板電腦針對不同的設(shè)備自適應(yīng)漂亮的responsive界面支持HTML5標準提供JuiceboxBuilder程序，可以方便的處理圖片2個版本，lite和pro版。

在線演示 本地下載

如何使用

導(dǎo)入類庫如下：

<script src="jbcore/juicebox.js"></script>  
<script>  
    new juicebox({  
        containerId : 'juicebox-container' 
    });  
</script> 

使用xml文件配置圖片文件：

<juiceboxgallery  
    galleryTitle="Juicebox Lite Gallery" 
>  
  <image imageURL="images/wide.jpeg" 
    thumbURL="thumbs/wide.jpeg" 
    linkURL="images/wide.jpeg" 
    linkTarget="_blank">  
    <title>Welcome to Juicebox!</title>  
  </image>  
  <image imageURL="images/tall.jpeg" 
    thumbURL="thumbs/tall.jpeg" 
    linkURL="images/tall.jpeg" 
    linkTarget="_blank">  
    <caption><![CDATA[<u><a href="http://www.juicebox.net" target="_blank">Juicebox</a></u> is a free, customizable image gallery. Use it to display your images on any web page in a professional, intuitive and simple way.]]></caption>  
  </image>  
</juiceboxgallery> 

原文鏈接：http://www.phpfuns.com/html5/html5-picture-gallery.shtml