看到论坛上有人也需要这样的方法。看了下,自己也改了个JS调用的图片切换效果。
由于我这样的菜鸟大概没有上传的权限,所以只好写步骤而不传文件了。
第一步,把下面这一段JS保存为ad.js。
引用:
imgUrl1="UPLOAD/01.jpg"; //图片地址,下同
imgtext1="测试" //图片的说明文字,下同
imgLink1=escape("http://www.makewing.com"); //图片的超连接地址,下同
imgUrl2="UPLOAD/02.jpg";
imgtext2="测试2"
imgLink2=escape("http://www.makewing.com");
imgUrl3="UPLOAD/03.jpg";
imgtext3="测试3"
imgLink3=escape("http://www.makewing.com");
imgUrl4="UPLOAD/04.jpg";
imgtext4="测试4"
imgLink4=escape("http://www.makewing.com");
imgUrl5="UPLOAD/05.jpg";
imgtext5="测试5"
imgLink5=escape("http://www.makewing.com");
var focus_width=190 //宽度
var focus_height=160 //高度
var text_height=20
var swf_height = focus_height+text_height
var pics=imgUrl1+"|"+imgUrl2+"|"+imgUrl3+"|"+imgUrl4+"|"+imgUrl5
var links=imgLink1+"|"+imgLink2+"|"+imgLink3+"|"+imgLink4+"|"+imgLink5
var texts=imgtext1+"|"+imgtext2+"|"+imgtext3+"|"+imgtext4+"|"+imgtext5
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="'+ focus_width +'" height="'+ swf_height +'">');
document.write('<param name="allowScriptAccess" value="sameDomain"><param name="movie" value="script/pixviewer.swf"><param name="quality" value="high"><param name="bgcolor" value="#F0F0F0">');
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='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'">');
document.write('<embed src="script/pixviewer.swf" wmode="opaque" FlashVars="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'" menu="false" bgcolor="#F0F0F0" quality="high" width="'+ focus_width +'" height="'+ focus_height +'" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />');document.write('</object>');
这个文件做了简单的说明,很容易理解。
第二步:把ad.js文件放入SCRIPT文件夹。把bestsky.cn说的那个FLASHPIC插件目录下面的plugin\flashpic目录下的pixviewer.swf文件也拷贝到SCRIPT文件夹。
第三步:修改模板,打开TEMPLATE目录下的default.html,找到<div id="divSidebar">插入如下代码
引用:
<div class="function" id="divAD">
<a target=_self href="javascript:goUrl()" style="border:none;margin:0;padding:0;">
<span style="border:none">
<script language="JavaScript" src="<#ZC_BLOG_HOST#>script/ad.js" type="text/javascript"></script>
</span></a>
</div>
这个DIVAD的DIV是自己添加的。用function的class即可。
ok,完工了。当然如果你觉得文件太混乱,可以修改以适应到相应的目录即可。
至于以后如何修改这个幻灯广告的话,很简单,后台管理里的文件管理,进入script目录对ad.js进行编辑即可。
需要注意的地方:这个JS文件必须保存为UTF-8的,不然乱码。
需要改进的地方:IE测试正常,FF测试有小小的问题,就是图片下面那个说明文字高度不够,改了都没有效果,郁闷。不知道哪位大虾能够完善下?
谢谢。