当前的项目中要用到的效果,网上下了几个"源码",但都不是很如意,只好自己研究了,效果演示地址: http://www.cnbeta.com/ ,首页的左边的那个图片轮播就是我想要的效果, 研究了一下他的源码,发现原来是这么简单呀..一段JS代码搞掂.
Js代码
  1.     <script language="javascript">   
  2. linkarr = new Array();   
  3. picarr = new Array();   
  4. textarr = new Array();   
  5. var focus_width=409;   // 图片的宽度   
  6. var focus_height=307;  // 图片的高度   
  7. var text_height=20;  // 底部文字的高度   
  8. var pics = "";   
  9. var links = "";   
  10. var texts = "";   
  11. var swf_height = focus_height+text_height;   // 整个轮换效果的高度=图片高度+底部文字高度   
  12. var defJpeg = "http://www.cnbeta.com/p_w_picpaths/index_37.jpg";   
  13.   
  14. linkarr[1]="http://www.cnbeta.com/articles/73700.htm";picarr[1] ="p_w_picpaths/1.jpg";textarr[1]="cnBeta 08年度精彩评论";linkarr[2]="http://www.cnbeta.com/articles/73715.htm";picarr[2] ="p_w_picpaths/2.jpg";textarr[2]="×××常务会议同意启动3G牌照发放";linkarr[3]="http://www.cnbeta.com/articles/73734.htm";picarr[3] ="p_w_picpaths/3.jpg";textarr[3]="cnBeta 2009 新年献词";linkarr[4]="http://www.cnbeta.com/articles/73473.htm";picarr[4] ="p_w_picpaths/4.jpg";textarr[4]="三大XP盗版集团全面撤退 灰色产业链悄然漂白";linkarr[5]="http://www.cnbeta.com/articles/73531.htm";picarr[5] ="p_w_picpaths/5.jpg";textarr[5]="儿时经典动画《葫芦兄弟》也要出网游啦";   
  15.   
  16. for(i=1;i<picarr.length;i++){   
  17.   //if(picarr[i].indexOf("jpg")==-1 && picarr[i].indexOf("JPG")==-1) picarr[i] = defJpeg;   
  18.   if(pics=="") pics = picarr[i];   
  19.   else pics += "|"+picarr[i];   
  20. }   
  21.   
  22. for(i=1;i<linkarr.length;i++){   
  23.   if(links=="") links = linkarr[i];   
  24.   else links += "|"+linkarr[i];   
  25. }   
  26.   
  27. for(i=1;i<textarr.length;i++){   
  28.   if(texts=="") texts = textarr[i];   
  29.   else texts += "|"+textarr[i];   
  30. }   
  31.   
  32.   
  33. document.write('<object type="application/x-shockwave-flash" data="template/slide.swf" width="' + focus_width + '" height="' + swf_height + '">');   
  34.             document.write('<param name="movie" value="template/slide.swf" />');   
  35.             document.write('<param name="allowScriptAcess" value="sameDomain" />');   
  36.             document.write('<param name="quality" value="best" />');   
  37.             document.write('<param name="bgcolor" value="#E5ECF4" />');   
  38.             document.write('<param name="scale" value="noScale" />');   
  39.             document.write('<param name="menu" value="false">');   
  40.             document.write('<param name="wmode" value="opaque" />');   
  41.             document.write('<param name="FlashVars" value="playerMode=embedded&pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'" />');   
  42.             document.write('</object>');   
  43.   
  44. </script>  

    实现图片轮换效果的其实是一个flash,就是那个template/slide.swf,真想看看他的源码,不知道他是怎么读取传进去的参数的哦!!!
    要注意的时候图片和那个slide.swf必须在同一站点下,要不然就会显示出错了,比如上面的代码改成http://www.cnbeta.com/template/slide.swf后显示就不正常了!!!
    下面附上源码

    发现javaeye对chrome浏览器支持不够好啊...在chrome里写完文章了上传附件的时候总是上传不了...在FF里就没问题!!!