CMSware实现幻灯片效果

来自站长百科
跳转至： 导航、​ 搜索

导航：返回上一页

效果一：新浪的flash幻灯效果[ ]

演示请见：http://ent.sina.com.cn/

模版已经包含在官方程序发布包 

<html>
<head>
<title>幻灯片代码</title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
</head>

<body bgcolor="#ffffff" text="#000000">

<!--幻灯代码开始-->
<CMS action="LIST" return="List" NodeID="15" Num="5" where=" c.Photo!='' " />

<script type="text/javascript">
<!--

var pic_width=281
var pic_height=192
var text_height=50
var swfpath = 'http://你的flash文件路径 /picviewer.swf'
var swf_height = pic_height+text_height

var pics='<loop name="List" var="var" key="key" >[$var.Photo][@(($key==sizeof($List)-1)?'':'|')]</loop>'
var links='<loop name="List" var="var" key="key" >[$var.URL][@(($key==sizeof($List)-1)?'':'|')]</loop>'
var texts='<loop name="List" var="var" key="key" >[$var.Title][@(($key==sizeof($List)-1)?'':'|')]</loop>'

document.write('<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash
/swflash.cab#version=6,0,0,0" width="'+ pic_width +'" height="'+ swf_height +'">');
document.write('<param name="allowScriptAccess" value="sameDomain"><param name="movie" value="'+swfpath+'"><param name="quality" value="high">
<param name="bgcolor" value="#ffffff">');
document.write('<param name="menu" value="false"><param name=wmode value="opaque">');
document.write('<param name="FlashVars" value="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+pic_width+'&borderheight='+pic_height+'&
textheight='+text_height+'">');
document.write('<embed src="'+swfpath+'" wmode="opaque" FlashVars="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+pic_width+'&
borderheight='+pic_height+'&textheight='+text_height+'" menu="false" bgcolor="#ffffff" quality="high" width="'+ pic_width +'" height="'+ pic_height
 +'" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" 
/>');document.write('</object>');

//-->
</script>
<!--幻灯代码结束-->
</body>
</html>

简单再解释一下： 

<CMS action="LIST" return="List" NodeID="15" Num="5" where=" c.Photo!='' " /> 这个是思维([[CMSware]])的循环
var focus_width=281--------显示图片的宽度
var focus_height=192-------显示图片的高度
var text_height=50----------文字(标题)的高度
var swfpath = 'http://你的flash文件路径/picviewer.swf' ----你的flash文件位置
var pics='<loop name="List" var="var" key="key" >[$var.Photo][@(($key==sizeof($List)-1)?:'|')]</loop>'
var links='<loop name="List" var="var" key="key" >[$var.URL][@(($key==sizeof($List)-1)?:'|')]</loop>'
var texts='<loop name="List" var="var" key="key" >[$var.Title][@(($key==sizeof($List)-1)?:'|')]</loop>'

分别定义了图像、链接、文本(标题)的地址。用竖线“|”分割。

[@(($key==sizeof($List)-1)?'':'|')] 这个调用的意思是如果是最后一个了，就不在后面加竖线了

你可以更改以上这些数值使flash幻灯适合你的网页。当然也可以不改

效果二：nusports.cn图片播放FLASH特效[ ]

演示请见：http://www.nusports.cn/ 

<CMS action="LIST" return="List" NodeID="{$NodeInfo.NodeID}" Num="5" where=" c.Photo!='' " />
<script type="text/javascript">
var pics='<loop name="List" var="var" key="key" >[@AutoMini($var.Photo,'450*200',$var)][@(($key==sizeof($List)-1)?'':'|')]</loop>' //大图开始
var titles='<loop name="List" var="var" key="key" >[$var.Title][@(($key==sizeof($List)-1)?'':'|')]</loop>'//TITLE 开始
var title_links='<loop name="List" var="var" key="key" >[$var.Title][@(($key==sizeof($List)-1)?'':'|')]</loop>'//URL链接
var mains='<loop name="List" var="var" key="key" >[$var.Title][@(($key==sizeof($List)-1)?'':'|')]</loop>'//简介处，自行替换 [$var.Title] 标签就OK了
var listpic='<loop name="List" var="var" key="key" >[@AutoMini($var.Photo,'98*70',$var)][@(($key==sizeof($List)-1)?'':'|')]</loop>' //小图开始
var keys='<loop name="List" var="var" key="key" >[$var.Title][@(($key==sizeof($List)-1)?'':'#')]</loop>'//关键字处，如果不用。则留N个#以结束 ,N为调
用的个数-1
var ads='自由水晶FLASH幻灯版大测试，这是广告位' //广告位

document.write('<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash
/swflash.cab#version=6,0,0,0" width="450" height="388" />');
document.write('<param name="allowScriptAccess" value="sameDomain" />');
document.write('<param name="movie" value="photo.swf" />'); //
document.write('<param name="quality" value="high" />');
document.write('<param name="bgcolor" value="#D3D5DE" />');
document.write('<param name="menu" value="false" />');
document.write('<param name=wmode value="opaque" />');
document.write('<param name="FlashVars" value="pics='+pics+'&titles='+titles+'&title_links='+title_links+'&mains='+mains+'&listpic='+listpic+'&
keys='+keys+'&ads='+ads+'" />');
document.write('<embed src="photo.swf" FlashVars="pics='+pics+'&titles='+titles+'&title_links='+title_links+'&mains='+mains+'&listpic='+listpic+'&
keys='+keys+'&ads='+ads+'" width="450" height="388" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" 
pluginspage="http://www.macromedia.com/go/getflashplayer"/>');
document.write('</object>');
</script>

简单说明：

photo.swf为flash文件的地址。

效果三：搜狐女性频道图片播放FLASH特效[ ]

演示请见：http://women.sohu.com/ 

<CMS action="LIST" return="List" NodeID="{$NodeInfo.NodeID}" Num="5" where=" c.Photo!='' " />
<script type=text/javascript>
var varText = ""
function addInfo(title,photourl,link){
if(varText!=""){
varText+="|||";
}
varText+=title+"|_|"+photourl+"|_|"+link;
}<loop name="List" var="var" key="key" >
addInfo("[$var.Title]","[$var.Photo]","[$var.URL]"); //调用字段： 标题Title、图片Photo、链接URL
</loop>

//
document.write('<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash
/swflash.cab#version=6,0,0,0" width="410" height="200" id="01" align="center">')
document.write('<param name="allowScriptAccess" value="sameDomain" />')
document.write('<param name="movie" value="01.swf?info='+varText+'" />')
document.write('<param name="quality" value="high" />')
document.write('<param name="bgcolor" value="#ffffff" /><param name="wmode" value="transparent" />')
document.write('<embed src="01.swf" quality="high" bgcolor="#ffffff" width="410" height="200" name="01" align="center"
allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />')
document.write('</object>')
</SCRIPT>

代码如上，比以前的那个FLASH特效代码（就是点 1 2 3 ...那个的）还简单，效果不错，挺漂亮的。

下面是另一个的,就是点 1 2 3 ...那个的幻灯FLASH 

<!--幻灯代码开始, 调整以下cms调用参数以获取您想要的图片-->
<CMS action="LIST" return="List" NodeID="{$NodeInfo.NodeID}" Num="5" where=" c.Photo!='' " />
<script type="text/javascript">
<!--
var pic_width = 306 //图片宽
var pic_height = 200 //图片高
var text_height = 20 //图片标题高,可以不要标题显示设为0
var swfpath = '02.swf' //02.swf的位置,请修改成你的, 默认在/www/
var swf_height = pic_height+text_height //Flash高,会自动计算

//调用字段： 图片Photo、链接URL、标题Title
var pics='<loop name="List" var="var" key="key" >[$var.Photo][@(($key==sizeof($List)-1)?'':'|')]</loop>'
var links='<loop name="List" var="var" key="key" >[$var.URL][@(($key==sizeof($List)-1)?'':'|')]</loop>'
var texts='<loop name="List" var="var" key="key" >[$var.Title][@(($key==sizeof($List)-1)?'':'|')]</loop>'

document.write('<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash
/swflash.cab#version=6,0,0,0" width="'+ pic_width +'" height="'+ swf_height +'">');
document.write('<param name="allowScriptAccess" value="sameDomain"><param name="movie" value="'+swfpath+'"><param name="quality" value="high">
<param name="bgcolor" value="#ffffff">');
document.write('<param name="menu" value="false"><param name=wmode value="opaque">');
document.write('<param name="FlashVars" value="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+pic_width+'&borderheight='+pic_height+'&
textheight='+text_height+'">');
document.write('<embed src="'+swfpath+'" wmode="opaque" FlashVars="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+pic_width+'&
borderheight='+pic_height+'&textheight='+text_height+'" menu="false" bgcolor="#ffffff" quality="high" width="'+ pic_width +'" height="'+ pic_height
 +'" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />');?
 document.write('</object>');
//-->
</script>
<!--幻灯代码结束-->



参考来源[ ]

取自“https://www.zzbaike.com/wiki/index.php?title=CMSware实现幻灯片效果&oldid=50310”