帝国CMS图集显示插件使用说明1

一、显示效果

Q2n快乐收录网

二、使用语法说明

(一)、【显示图集函数语法说明】Q2n快乐收录网

1、格式： (其中“小图导航模板内容”参数可以不设置。)Q2n快乐收录网

2、使用范例1：Q2n快乐收录网

<?=sys_ModShowMorepic(120,80,)?>

3、使用范例2：(指定小图导航模板)Q2n快乐收录网

<?php $morepicdhtemp=<table><tr>[!--empirenews.listtemp--]<td bgcolor="#cccccc" align="center" id="espicid[!--page--]"[!--thiscss--]><a href="#empirecms" onclick="ecmsShowPic([!--page--]);"><img src="[!--spicurl--]" width="[!--spicwidth--]" height="[!--spicheight--]" border="0"></a><br>[!--spicno--]</td>[!--empirenews.listtemp--]</tr></table>; sys_ModShowMorepic(120,80,$morepicdhtemp); ?>

(二)、【显示内容的层ID说明】Q2n快乐收录网

1、显示内容层ID名称列表：Q2n快乐收录网

(1)、显示小图导航：ecmssmallpicsidQ2n快乐收录网

(2)、显示下拉分页导航：ecmsselectpagesidQ2n快乐收录网

(3)、显示列表分页导航：ecmslistpagesidQ2n快乐收录网

(4)、表单ID：eViewPicFormQ2n快乐收录网

(5)、当前分页号：ethispageQ2n快乐收录网

(6)、是否自动播放：autoplaystopQ2n快乐收录网

(7)、自动播放秒数：autoplaysecQ2n快乐收录网

(8)、大图显示：ecmsbigpicidQ2n快乐收录网

(9)、小图显示：ecmssmallpicidQ2n快乐收录网

(10)、图片说明：ecmspicnameidQ2n快乐收录网

2、例子：显示小图导航位置Q2n快乐收录网

<div id="ecmssmallpicsid"></div>

(三)、【小图导航模板变量说明】 Q2n快乐收录网

1、模板制作格式： 列表头[!--empirenews.listtemp--]列表内容[!--empirenews.listtemp--]列表尾Q2n快乐收录网

2、变量说明：Q2n快乐收录网

(1)、[!--page--]：图片页码Q2n快乐收录网

(2)、[!--thiscss--]：当前图的CSS样式Q2n快乐收录网

(3)、[!--spicurl--]：小图图片地址Q2n快乐收录网

(4)、[!--spicwidth--]：图片宽度Q2n快乐收录网

(5)、[!--spicheight--]：图片高度Q2n快乐收录网

(6)、[!--spicno--]：当前图片编号Q2n快乐收录网

3、模板范例：Q2n快乐收录网

<table><tr>[!--empirenews.listtemp--]<td bgcolor="#cccccc" align="center" id="espicid[!--page--]"[!--thiscss--]><a href="#empirecms" onclick="ecmsShowPic([!--page--]);"><img src="[!--spicurl--]" width="[!--spicwidth--]" height="[!--spicheight--]" border="0"></a><br>[!--spicno--]</td>[!--empirenews.listtemp--]</tr></table>

(四)、【CSS定义说明】

1、CSS名称说明：Q2n快乐收录网

(1)、小图导航(当前图样式)css名称：espiccssQ2n快乐收录网

(2)、列表分页导航(当前分页样式)css名称：epiclpcssQ2n快乐收录网

(3)、大图显示css名称：eimgBoxQ2n快乐收录网

2、使用范例：Q2n快乐收录网

<style> /* 小图导航(当前图样式) */ .espiccss{background-color:#666666;color:#ffffff;} /* 列表分页导航(当前分页样式) */ .epiclpcss{font-weight:bold;} /* 大图显示 */ .eimgBox{ position: relative; float:left;} .eimgBox div{ position:absolute; left:0px; top:0px; width:50%; height:98%; background: #fff; opacity:0.0; filter:alpha(opacity=0); } .eimgBox .eimgboxleft{ cursor: pointer; } .eimgBox .eimgboxright{ left:50%; cursor: pointer; } </style>

(五)、【其它说明】

1、支持键盘方向键切换图片。Q2n快乐收录网

2、点击图片左右两边切换上下张图片。Q2n快乐收录网