您的位置:首页 > 其它

简单省事的图片特效

2014-03-22 16:24 176 查看
到目前为止,我做网站已经4个月了。期间遇到过不少问题,可是也学到了不少的知识,今天想整理一下自己之前所总结的有用的东西。

我感觉要做一个好网站、一个赏心悦目的网站不仅要有好的网页布局,而且整个页面的动态效果也很重要。所以在整个网站制作的过程中我总结了不少有关页面效果的js,今天把我的这些收获分享给大家。

下面这个例子是一般在网站的首页会用到的图片效果,下面这段js代码就是要插入到你所要显示的图片特效的位置处:

<script type="text/javascript" language="javascript">

var interval_time = 5;

var focus_width = 1004;

var focus_height = 510;

var text_height = 0;

var text_mtop = 0;

var text_lm = 10;

var textmargin = text_mtop + "|" + text_lm;

var textcolor = "#2E5DB5|0xFF0000";

var text_align = 'left';

var swf_height = focus_height + text_height + text_mtop;

var text_size = 14;

var borderStyle = "1|0x000000|0";

var pics = "images/01.jpg|images/02.jpg|images/03.jpg|images/04.jpg";

var links = '#|#|#';

var texts = '1|2|3|4|';

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="/images/flash.swf"> <param name="quality" value="high"><param name="Wmode" value="transparent">');

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 + '&textmargin=' + textmargin + '&textcolor='
+ textcolor + '&borderstyle=' + borderStyle + '&text_align=' + text_align + '&interval_time=' + interval_time + '&textsize=' + text_size + '">');

document.write('<embed src="images/flash.swf" wmode="opaque" FlashVars="pics=' + pics + '&links=' + links + '&texts=' + texts + '&borderwidth=' + focus_width + '&borderheight=' + focus_height + '&textheight='
+ text_height + '&textmargin=' + textmargin + '&textcolor=' + textcolor + '&borderstyle=' + borderStyle + '&text_align=' + text_align + '&interval_time=' + interval_time + '&textsize=' + text_size + '" menu="false" bgcolor="#ffffff" quality="high" width="'
+ focus_width + '" height="' + swf_height + '" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />'); document.write('</object>');

</script>

var focus_width = 1004;

var focus_height = 510;

宽度和高度是可以自己调整的,也可以自己设置图片的个数。

其中flash.swf是已经写好的一个swf,我们只需引用就行了,大家可以试试奥,很方便的!

flash.swf已传上
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: