懒人图库-JS“焦点图”代码 漂亮的图片变化效果

http://www.lanrentuku.com/js/jiaodiantu.html

 

 

网页中图片变换的效果是如何制作的？

即如何在一个确定的区域内动态地显示几张不同的图片

 

在你想放图片效果的位置插入
<script type="text/javascript">
<!--

var focus_width=490
var focus_height=130
var text_height=0
var swf_height = focus_height+text_height

var pics='/images/main1.jpg|/images/main2.jpg|/images/main3.jpg|/images/main4.jpg'
var links='http://www.dwww.cn|http://www.dwww.cn|http://www.dwww.cn/|http://www.dwww.cn'
var texts=''

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="/flash/pixviewer.swf"><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='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'">');
document.write('<embed src="/flash/pixviewer.swf" wmode="opaque" FlashVars="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'" menu="false" bgcolor="#ffffff" 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>');

//-->
</script></a>
<!-- 动态图结束 -->

这和新浪的http://eladies.sina.com.cn/动态图是一样的,按照说明我们还要在images目录下放main1.jpg,main2.jpg,main3.jpg,main4.jpg这样的图,还要在flash目录下边放一个pixviewer.swf就OK了。