ReadMe.html 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>帝国CMS-图集显示插件</title>
  6. <style type=text/css>
  7. <!--
  8. { font-family: 宋体; font-size: 12px; line-height: 19px; color: #333333;text-decoration: none} a:hover { color: #FF0000}a:hover { text-decoration: none}a:hover { line-height: 19px}a:link { font-family: 宋体; font-size: 14px; line-height: 19px; color: #333333;text-decoration: none} a:visited { text-decoration: none; }Table{ font-family: 宋体; font-size: 13px; color: #000000; line-height: 21px; text-decoration: none } }
  9. .box {border: 1px solid #333333;height: 10px;width: 10px;font-size:1px;cursor:hand;filter:blur(add=ture,direction=135,strength=2);}
  10. .STYLE1 {color: #666666}
  11. -->
  12. </Style>
  13. </head>
  14. <body>
  15. <table width="800" border="0" align="center" cellpadding="3" cellspacing="1" bgcolor="#4FB4DE">
  16. <tr>
  17. <td height="38"><div align="center"><strong><font color="#FFFFFF" size="4">帝国CMS - 图集显示插件使用说明</font></strong></div></td>
  18. </tr>
  19. <tr>
  20. <td height="30" bgcolor="#FFFFFF"> <div align="center"><a href="http://www.phome.net/OpenSource/" target="_blank"><font color="#FF0000"><strong>帝国CMS - 稳定可靠、安全省心</strong></font></a></div></td>
  21. </tr>
  22. <tr>
  23. <td height="23" bgcolor="#C9F1FF"><strong>一、显示效果:</strong></td>
  24. </tr>
  25. <tr>
  26. <td height="30" bgcolor="#FFFFFF"> <table width="99%" border="0" align="center" cellpadding="1" cellspacing="1">
  27. <tr>
  28. <td height="23"><div align="center"><img src="doc/demopic.jpg" width="600" height="600"></div></td>
  29. </tr>
  30. </table>
  31. <br></td>
  32. </tr>
  33. <tr>
  34. <td height="23" bgcolor="#C9F1FF"><strong>二、使用语法说明</strong></td>
  35. </tr>
  36. <tr>
  37. <td height="30" bgcolor="#FFFFFF"> <table width="99%" border="0" align="center" cellpadding="1" cellspacing="1">
  38. <tr>
  39. <td height="25"><strong><font color="#0000FF">(一)、【显示图集函数语法说明】</font></strong></td>
  40. </tr>
  41. <tr>
  42. <td height="25"><strong>1、格式:</strong></td>
  43. </tr>
  44. <tr>
  45. <td height="25"><input name="textarea" type="text" style="WIDTH:100%" value="sys_ModShowMorepic(导航小图宽度,导航小图高度,小图导航模板内容)" size="60"></td>
  46. </tr>
  47. <tr>
  48. <td height="25"><font color="#666666">(其中“小图导航模板内容”参数可以不设置。)</font></td>
  49. </tr>
  50. <tr>
  51. <td height="25"><strong>2、使用范例1:</strong></td>
  52. </tr>
  53. <tr>
  54. <td height="25"><textarea name="textarea2" cols="80" rows="2" wrap="off" style="WIDTH:100%">&lt;?=sys_ModShowMorepic(120,80,'')?&gt;</textarea></td>
  55. </tr>
  56. <tr>
  57. <td height="25"><strong>3、使用范例2:</strong>(指定小图导航模板)</td>
  58. </tr>
  59. <tr>
  60. <td height="25"><textarea name="textarea3" cols="80" rows="5" wrap="off" style="WIDTH:100%">&lt;?php
  61. $morepicdhtemp='&lt;table&gt;&lt;tr&gt;[!--empirenews.listtemp--]&lt;td bgcolor=&quot;#cccccc&quot; align=&quot;center&quot; id=&quot;espicid[!--page--]&quot;[!--thiscss--]&gt;&lt;a href=&quot;#empirecms&quot; onclick=&quot;ecmsShowPic([!--page--]);&quot;&gt;&lt;img src=&quot;[!--spicurl--]&quot; width=&quot;[!--spicwidth--]&quot; height=&quot;[!--spicheight--]&quot; border=&quot;0&quot;&gt;&lt;/a&gt;&lt;br&gt;[!--spicno--]&lt;/td&gt;[!--empirenews.listtemp--]&lt;/tr&gt;&lt;/table&gt;';
  62. sys_ModShowMorepic(120,80,$morepicdhtemp);
  63. ?&gt;</textarea></td>
  64. </tr>
  65. <tr>
  66. <td height="25">&nbsp;</td>
  67. </tr>
  68. <tr>
  69. <td height="25"><strong><font color="#0000FF">(二)、【显示内容的层ID说明】</font></strong></td>
  70. </tr>
  71. <tr>
  72. <td height="25"><strong>1、显示内容层ID名称列表:</strong></td>
  73. </tr>
  74. <tr>
  75. <td height="25"><p> (1)、显示小图导航:ecmssmallpicsid<br>
  76. (2)、显示下拉分页导航:ecmsselectpagesid<br>
  77. (3)、显示列表分页导航:ecmslistpagesid</p>
  78. <p>(4)、表单ID:eViewPicForm<br>
  79. (5)、当前分页号:ethispage<br>
  80. (6)、是否自动播放:autoplaystop<br>
  81. (7)、自动播放秒数:autoplaysec<br>
  82. (8)、大图显示:ecmsbigpicid<br>
  83. (9)、小图显示:ecmssmallpicid<br>
  84. (10)、图片说明:ecmspicnameid</p></td>
  85. </tr>
  86. <tr>
  87. <td height="25"><strong>2、例子:</strong>显示小图导航位置 </td>
  88. </tr>
  89. <tr>
  90. <td height="25">
  91. <textarea name="textarea4" cols="80" rows="2" wrap="off" style="WIDTH:100%">&lt;div id=&quot;ecmssmallpicsid&quot;&gt;&lt;/div&gt;</textarea></td>
  92. </tr>
  93. <tr>
  94. <td height="25">&nbsp;</td>
  95. </tr>
  96. <tr>
  97. <td height="25"><strong><font color="#0000FF">(三)、【小图导航模板变量说明】</font></strong></td>
  98. </tr>
  99. <tr>
  100. <td height="25"><strong>1、模板制作格式:</strong></td>
  101. </tr>
  102. <tr>
  103. <td height="25">列表头[!--empirenews.listtemp--]列表内容[!--empirenews.listtemp--]列表尾</td>
  104. </tr>
  105. <tr>
  106. <td height="25"><strong>2、变量说明:</strong></td>
  107. </tr>
  108. <tr>
  109. <td height="25">(1)、[!--page--]:图片页码<br>
  110. (2)、[!--thiscss--]:当前图的CSS样式<br>
  111. (3)、[!--spicurl--]:小图图片地址<br>
  112. (4)、[!--spicwidth--]:图片宽度<br>
  113. (5)、[!--spicheight--]:图片高度<br>
  114. (6)、[!--spicno--]:当前图片编号</td>
  115. </tr>
  116. <tr>
  117. <td height="25"><strong>3、模板范例:</strong></td>
  118. </tr>
  119. <tr>
  120. <td height="25"><textarea name="textarea5" cols="80" rows="2" wrap="off" style="WIDTH:100%">&lt;table&gt;&lt;tr&gt;[!--empirenews.listtemp--]&lt;td bgcolor=&quot;#cccccc&quot; align=&quot;center&quot; id=&quot;espicid[!--page--]&quot;[!--thiscss--]&gt;&lt;a href=&quot;#empirecms&quot; onclick=&quot;ecmsShowPic([!--page--]);&quot;&gt;&lt;img src=&quot;[!--spicurl--]&quot; width=&quot;[!--spicwidth--]&quot; height=&quot;[!--spicheight--]&quot; border=&quot;0&quot;&gt;&lt;/a&gt;&lt;br&gt;[!--spicno--]&lt;/td&gt;[!--empirenews.listtemp--]&lt;/tr&gt;&lt;/table&gt;</textarea></td>
  121. </tr>
  122. <tr>
  123. <td height="25">&nbsp;</td>
  124. </tr>
  125. <tr>
  126. <td height="25"><strong><font color="#0000FF">(四)、【CSS定义说明】</font></strong></td>
  127. </tr>
  128. <tr>
  129. <td height="25"><strong>1、CSS名称说明:</strong></td>
  130. </tr>
  131. <tr>
  132. <td height="25">(1)、小图导航(当前图样式)css名称:espiccss</td>
  133. </tr>
  134. <tr>
  135. <td height="25">(2)、列表分页导航(当前分页样式)css名称:epiclpcss</td>
  136. </tr>
  137. <tr>
  138. <td height="25">(3)、大图显示css名称:eimgBox</td>
  139. </tr>
  140. <tr>
  141. <td height="25"><strong>2、使用范例:</strong></td>
  142. </tr>
  143. <tr>
  144. <td height="25"><textarea name="textarea6" cols="80" rows="12" wrap="off" style="WIDTH:100%">&lt;style&gt;
  145. /* 小图导航(当前图样式) */
  146. .espiccss{background-color:#666666;color:#ffffff;}
  147. /* 列表分页导航(当前分页样式) */
  148. .epiclpcss{font-weight:bold;}
  149. /* 大图显示 */
  150. .eimgBox{
  151. position: relative;
  152. float:left;
  153. }
  154. .eimgBox div{
  155. position:absolute;
  156. left:0px;
  157. top:0px;
  158. width:50%;
  159. height:98%;
  160. background: #fff;
  161. opacity:0.0;
  162. filter:alpha(opacity=0);
  163. }
  164. .eimgBox .eimgboxleft{
  165. cursor: pointer;
  166. }
  167. .eimgBox .eimgboxright{
  168. left:50%;
  169. cursor: pointer;
  170. }
  171. &lt;/style&gt;</textarea></td>
  172. </tr>
  173. <tr>
  174. <td height="25">&nbsp;</td>
  175. </tr>
  176. <tr>
  177. <td height="25"><strong><font color="#0000FF">(五)、【其它说明】</font></strong></td>
  178. </tr>
  179. <tr>
  180. <td height="25">1、支持键盘方向键切换图片。<br>
  181. 2、点击图片左右两边切换上下张图片。</td>
  182. </tr>
  183. <tr>
  184. <td height="25">&nbsp;</td>
  185. </tr>
  186. </table></td>
  187. </tr>
  188. <tr>
  189. <td><strong><font color="#FFFFFF">三、完整范例</font></strong></td>
  190. </tr>
  191. <tr>
  192. <td bgcolor="#FFFFFF"><table width="99%" border="0" align="center" cellpadding="3" cellspacing="1">
  193. <tr>
  194. <td><strong>内容模板使用图集显示插件完整范例:</strong>可参考本目录下的“<a href="example.html" target="_blank">example.html</a>”文件html源代码。</td>
  195. </tr>
  196. </table></td>
  197. </tr>
  198. <tr>
  199. <td>&nbsp;</td>
  200. </tr>
  201. </table>
  202. <hr>
  203. <table width="100%" border="0" cellspacing="1" cellpadding="1">
  204. <tr>
  205. <td height="25">
  206. <div align="center"><a href="http://www.phome.net" target="_blank">官方网站</a> |
  207. <a href="http://bbs.phome.net" target="_blank">论坛交流</a> | <a href="http://www.phome.net/product/" target="_blank">产品中心</a>
  208. | <a href="http://www.phome.net/download/" target="_blank">产品下载中心</a></div></td>
  209. </tr>
  210. </table>
  211. </body>
  212. </html>