首页 > CMS > 动易CMS > 正文

如何将图片内容页的显示效果完全个性化?

2024-09-10 21:54:05
字体:
来源:转载
供稿:网友

如何将图片内容页的显示效果完全个性化?

动易2006版在图片内容页使用了全新的客户端JS代码来实现默认效果,所以假如您对JS代码懂一点话,稍微修改一下,您就可以实现任意效果。这里先把原理和大家说一下。

在学习本文前,请先具体了解图片内容页的标签及作用。这是标签说明的文章:/help/ShowArticle.asp?ArticleID=638


我们先来看几个标签解析后的HTML代码。

1、{$ViewPhoto}标签,解析后的代码为:
<div id='imgBox'></div>
<script language='javascript'>
function ViewPhoto(PhotoUrl){
var strHtml;
var FileExt=PhotoUrl.substr(PhotoUrl.lastIndexOf('.') 1).toLowerCase();
if(FileExt=='gif'||FileExt=='jpg'||FileExt=='png'||FileExt=='bmp'||FileExt=='jpeg'){
strHtml="<a href='" PhotoUrl "' target='PhotoView'><img src='" PhotoUrl "' border='0' onload='if(this.width>800) this.}else if(FileExt=='swf'){
strHtml="<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0' name='imgBox'><param name='movie' value='" PhotoUrl "'><param name='quality' value='high'><embed src='" PhotoUrl "' pluginspage='http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash' type='application/x-shockwave-flash' }else{
strHtml=PhotoUrl;
}
imgBox.innerHTML=strHtml;
}
ViewPhoto('/Photo/UploadPhotos/200605/20060504105712499.jpg');
</script>
分析一下我们即可知道:这里的实现原理是先定义一个层对象:imgBox,然后再定义一个JS函数:ViewPhoto(PhotoUrl),最后再调用这个函数,并将图片的地址传递给这个函数。这样就完成了图片的显示工作。所以假如我们要修改图片的显示效果,修改ViewPhoto()这个函数中的代码即可。

2、{$GetUrlArray}标签,解析后的代码:
<script language='javascript'>
var arrUrlName=new Array();
var arrUrl=new Array();
arrUrlName[0]='图片地址1';
arrUrl[0]='/Photo/UploadPhotos/200605/20060504105712499.jpg';
arrUrlName[1]='图片地址2';
arrUrl[1]='/Photo/UploadPhotos/200605/20060504105724329.jpg';
</script>
分析这段代码,我们看到是非常简单,得到两个数组:arrUrlName和arrUrl,分别表示图片地址的显示文字和图片地址。

3、{$PhotoUrlList}或{$PhotoUrlList(***)}标签,解析后的代码:
<script language='javascript'>
var arrUrlName=new Array();
var arrUrl=new Array();
arrUrlName[0]='图片地址1';
arrUrl[0]='/Photo/UploadPhotos/200605/20060504105712499.jpg';
arrUrlName[1]='图片地址2';
arrUrl[1]='/Photo/UploadPhotos/200605/20060504105724329.jpg';
</script>
<div id='PhotoUrlList'></div>
<script language='javascript'>
function ShowUrlList(page){
if(arrUrl.length<=1) return '';
var dTotalPage=arrUrl.length/5;
var TotalPage;
var MaxPerPage=5;
if(arrUrl.length%MaxPerPage==0){TotalPage=Math.floor(dTotalPage);}else{TotalPage=Math.floor(dTotalPage) 1;}
if(page<1) page=1;
if(page>TotalPage) page=TotalPage;
var strPage='<table><tr>';

共3页上一页123下一页
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选