3.1）创建测试文件夹Galleria
3.2）在Galleria下创建文件夹images，放需要展示的图片：
1.jpg
2.jpg
3.jpg
4.jpg
3.3）在Galleria下创建文件夹js，js下放2个js文件：
jquery.js(版本v1.4.2)
galleria-1.2.4.min.js
3.4）在Galleria下放4个必须的Galleria插件所需文件
classic-loader.gif
classic-map.png
galleria.classic.css(该css中会用到以上两张图片)
galleria.classic.min.js
注意：以上文件本文已提供完整Demo下载
4、在Galleria下创建galleryDemo.html页面，使用Galleria插件
注意：3.4中提到的文件需要和使用插件的页面(galleryDemo.html)放到同一文件夹下，如要变换文件位置需要修改css等代码
galleryDemo.html页面代码如下(关键部分已加入注释)：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=UTF-8" />
<title>Galleria Demo</title>
<script type="text/javascript" charset="UTF-8" src="js/jquery.js"></script>
<script type="text/javascript" src="js/galleria-1.2.4.min.js"></script>
<style type="text/css">
/* 图片组样式（Galleria插件默认配置） */
#contentImgs{background:#222margin:0}
#contentImgs{border-top:4px solid #000}
.contentImgsClass{color:#777font:12px/1.4 "helvetica neue",arial,sans-serifwidth:620pxmargin:20px auto}
#contentImgs h1{font-size:12pxfont-weight:normalcolor:#dddmargin:0}
#contentImgs p{margin:0 0 2px}
#contentImgs a {color:#22BCB9text-decoration:none}
#contentImgs .cred{margin-top:2pxfont-size:11px}
/* 展示的图片高度(This rule is read by Galleria to define the gallery height) */
#galleria{height:320px}
</style>
<script type="text/javascript">
$().ready(function(){
if($('#galleria')){
//加载Galleria插件
Galleria.loadTheme('galleria.classic.min.js')
$('#galleria').galleria()
}
})
</script>
</head>
<body>
<!-- 图片展示所在DIV -->
<div id="contentImgs" class="contentImgsClass">
<!-- 设置标题文字 -->
<h1> 图片组展示 </h1>
<div id="galleria">
<!-- 给图片加入a标签可以处理js事件 -->
<a href="javascript:alert('image1')">
<!-- title属性中可以设置图片说明 -->
<img title="图1" alt="" src="images/1.jpg" />
</a>
<a href="javascript:alert('image2')">
<img title="图2" alt="" src="images/2.jpg" />
</a>
<a href="javascript:alert('image3')">
<img title="图3" alt="" src="images/3.jpg" />
</a>
<a href="javascript:alert('image4')">
<img title="图4" alt="" src="images/4.jpg" />
</a>
</div>
<!-- 设置底部文字 -->
<p class="cred"></p>
</div>
</div>
</body>
</html>
ECShop2.5.1_Beta upload 的目录 ┣ activity.php 活动列表 ┣ affiche.php 广告处理文件 ┣ affiliate.php 生成商品列表 ┣ article.php 文章内容 ┣ article_cat.php文章分类 ┣ auction.php 拍卖前台文件 ┣ brand.php 品牌列表 ┣ captcha.php 生成验证码 ┣ catalog.php 列出所以分类及品牌 ┣ category.php 商品分类 ┣ comment.php 提交用户评论 ┣ compare.php 商品比较程序 ┣ cycle_image.php 轮播图片程序 ┣ feed.php RSS Feed 生成程序 ┣ flow.php 购物流程 ┣ gallery.php 商品相册 ┣ goods.php 商品详情 ┣ goods_script.php 生成商品列表 ┣ group_buy.php 团购商品前台文件 ┣ index.php 首页文件 ┣ myship.php 支付配送DEMO ┣ pick_out.php 选购中心 ┣ receive.php 处理收回确认的页面 ┣ region.php 地区切换程序 ┣ respond.php 支付响应页面 ┣ robots.txt ┣ search.php 搜索程序 ┣ sitemaps.php google sitemap 文件 ┣ snatch.php 夺宝奇兵前台页面 ┣ tag_cloud.php 标签云 ┣ topic.php 专题前台 ┣ user.php 会员中心 ┣ vote.php 调查程序 ┣ wholesale.php 批发前台文件 ┣ admin文件夹 ┃ ┣ account_log.php 管理中心帐户变动记录 ┃ ┣ admin_logs.php 记录管理员操作日志 ┃ ┣ ads.php 广告管理程序 ┃ ┣ adsense.php 站外JS投放的统计程序 ┃ ┣ ad_position.php广告位置管理程序 ┃ ┣ affiliate.php 程序说明 ┃ ┣ affiliate_ck.php 程序说明 ┃ ┣ agency.php 管理中心办事处管理 ┃ ┣ area_manage.php 地区列表管理文件 ┃ ┣ article.php 管理中心文章处理程序文件 ┃ ┣ articlecat.php 文章分类管理程序 ┃ ┣ article_auto.php ┃ ┣ attention_list.php ┃
