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> <!--幻灯代码结束-->