现在的位置: 首页 > 综合 > 正文

门户网站的flash图片新闻幻灯片效果

2014年11月09日 ⁄ 综合 ⁄ 共 18418字 ⁄ 字号 评论关闭

 各大门户网站Flash和JS实现的图片幻灯片切换特效代码文件下载:

<a target=_self href="goUrl()">
<span >
<script type="text/javascript">
imgUrl1="http://www.webjx.com/img/200406301.jpg";
imgtext1="网页教学网制作素材"
imgLink1=escape("http://www.webjx.com/htmldata/sort/8.html");
imgUrl2="http://www.webjx.com/img/200406302.jpg";
imgtext2="网页教学网网页制作专区"
imgLink2=escape("http://www.webjx.com/htmldata/sort/3.html");
imgUrl3="http://www.webjx.com/img/200406303.jpg";
imgtext3="网页教学网网页特效专区"
imgLink3=escape("http://www.webjx.com/htmldata/sort/5.html");
imgUrl4="http://www.webjx.com/img/200406304.jpg";
imgtext4="网页教学网视频教程"
imgLink4=escape("http://www.webjx.com/htmldata/sort/15.html");
imgUrl5="http://www.webjx.com/img/200406305.jpg";
imgtext5="网页教学网网页制作书籍"
imgLink5=escape("http://www.webjx.com/htmldata/sort/7.html");

var focus_width=280
var focus_height=158
var text_height=18
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 value="sameDomain"><param value="http://www.webjx.com/js/focus.swf"><param value="high"><param value="#F0F0F0">');
document.write('<param value="false"><param value="opaque">');
document.write('<param value="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'">');
document.write('<embed src="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 +'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />'); document.write('</object>');

</script>
</span></a><span </span>

图片幻灯片切换特效代码一、腾讯FLASH广告

在腾讯的网站上主要有两种形式的FLASH广告,一种是带有文章标题的,如腾讯汽车频道(http://auto.qq.com/);另一种是不带文章标题的,如腾讯音乐频道(http://ent.qq.com/music/)。其实大部分的门户网站也都是这样的,因此下面我们不再区分这两种FLASH广告形式。

FLASH广告的实现原理

我们看到的门户网站的FLASH广告实现起来其实非常的容易,就是用一个成形的FLASH文件+JS脚本调用,而在门户网站中,各大主编是不屑于手动修改 JS文件的,因此在发展的后期都是将JS文件和网站本身的发布程序结合起来,通过后台的动态数据调用,自动生成调用JS文件中的图片地址、标题文字以及链接地址信息,这样就非常容易的实现这种很奇妙的效果。

FLASH广告的优点

原先的各大网站都是用的JS脚本调用,经过测试,在图片为3张以上的时候,就会非常占用客户端的系统资源,以致影响网站的打开速度,其实大部分原因还是因为服务器以及带宽资源跟不上,不过一些小站的站长可能并没有注意到这点。而且,FLASH文件非常的小,即使JS文件出现问题,也不会影响整体页面的打开速度,这和以前JS出现问题,影响页面打开速度的尴尬局面有很大的不同。

腾讯汽车频道FLASH广告JS调用代码(带文章标题)
<!--

var focus_width=262
var focus_height=170
var text_height=20
var swf_height = focus_height+text_height
var pics='图片地址一|图片地址二|图片地址三|图片地址四|图片地址五'
var links='链接地址一|链接地址二|链接地址三|链接地址四|链接地址五'
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 value="sameDomain"><param value="http://auto.qq.com/flash/playswf.swf"><param value="high"><param value="#FFFFFF">');
document.write('<param value="false"><param value="http://blog.techweb.com.cn/opaque">');
document.write('<param value="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'">');
document.write('<embed src="http://auto.qq.com/flash/playswf.swf" wmode="opaque" FlashVars="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'" menu="false" bgcolor="#C5C5C5" quality="high" width="'+ focus_width +'" height="'+ swf_height +'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />'); document.write('</object>');

//-->

以上代码中,用户可以分别指出图片地址,链接地址和文章标题

腾讯音乐频道FLASH广告JS调用代码(不带文章标题)

<!--

var focus_width=199
var focus_height=242
var text_height=0
var swf_height = focus_height+text_height
var pics='图片地址一|图片地址二|图片地址三|图片地址四|图片地址五'
var links='链接地址一|链接地址二|链接地址三|链接地址四|链接地址五'
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 value="sameDomain"><param value="http://auto.qq.com/flash/playswf.swf"><param value="high"><param value="#FFFFFF">');
document.write('<param value="false"><param value="http://blog.techweb.com.cn/opaque">');
document.write('<param value="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'">');
document.write('<embed src="http://auto.qq.com/flash/playswf.swf" wmode="opaque" FlashVars="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'" menu="false" bgcolor="#C5C5C5" quality="high" width="'+ focus_width +'" height="'+ swf_height +'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />'); document.write('</object>');

//-->

以上代码中,用户可以分别指出图片地址,链接地址。

图片幻灯片切换特效代码

 

腾讯体育

 

======================================================

<body>
<table width="328" border="0" cellspacing="0" cellpadding="0" style="background:url(http://mat1.qq.com/sports/2008/typic2_08.jpg) repeat-x top; border:1px solid #B3D4EF">
      <tr>
        <td height="270" align="center" ><script type='text/javascript' src='http://mat1.qq.com/www/js/swfobjectopt.js'></script>
        <div id="dplayer4" style="margin:0px auto;padding:0px;width:316px;height:258;">不支持flash</div>
<script language="javascript" type="text/javascript">
var titles = "全满贯!费德勒横扫黑马法网登顶|精英赛丁俊晖0-6完败丢冠|NBA-湖人2-0加时胜魔术科比29分|F1-巴顿再封王平舒马赫纪录"
var imgs = "http://img1.qq.com/sports/pics/18186/18186008.jpg|http://img1.qq.com/sports/pics/18173/18173790.jpg|http://img1.qq.com/sports/pics/18191/18191528.jpg|http://img1.qq.com/sports/pics/18178/18178783.jpg"
var urls = "http://sports.qq.com/tennis/09FO/index.htm|http://sports.qq.com/others/tableb/snooker.htm|http://sports.qq.com/nba/|http://sports.qq.com/f1/index.htm"
    //alert(urls)
var pw = 316;
var ph = 258;
var sizes = 12;//链接文字大小
var Times = 4000 //间隔时间
var umcolor = 0x958683;//按纽颜色
var btnbg =0xD52100//选中按牛色
var txtcolor =0xFFFFFF//文本颜色
var flash = new SWFObject("http://mat1.qq.com/2008/flash/focusplay/focus1.swf", "mymovie", pw, ph, "7", "");
    flash.addParam("allowFullScreen", "true");
    flash.addParam("allowScriptAccess", "always");
    flash.addParam("quality", "high");
    flash.addParam("wmode", "Transparent");
    flash.addVariable("pw", pw);
    flash.addVariable("ph", ph);
    flash.addVariable("Times", Times);
    flash.addVariable("sizes", sizes);
    //flash.addVariable("umcolor", umcolor);//不需要可以注释掉
    flash.addVariable("btnbg", btnbg);//不需要可以注释掉
    flash.addVariable("txtcolor", txtcolor);//不需要可以注释掉
    flash.addVariable("urls", urls);
    flash.addVariable("titles", titles);
    flash.addVariable("imgs", imgs);
flash.write("dplayer4");
</script></td>
      </tr>
    </table>

</body>

 

==============================================================

 

 

swfobjectopt.js

 /**
 * SWFObject v1.4: Flash Player detection and embed - http://blog.deconcept.com/swfobject/
 *
 * SWFObject is (c) 2006 Geoff Stearns and is released under the MIT License:
 * http://www.opensource.org/licenses/mit-license.php
 *
 * **SWFObject is the SWF embed script formerly known as FlashObject. The name was changed for
 *   legal reasons.
 */
if(typeof deconcept=="undefined"){var deconcept=new Object();}
if(typeof deconcept.util=="undefined"){deconcept.util=new Object();}
if(typeof deconcept.SWFObjectUtil=="undefined"){deconcept.SWFObjectUtil=new Object();}
deconcept.SWFObject=function(_1,id,w,h,_5,c,_7,_8,_9,_a,_b){
if(!document.createElement||!document.getElementById){return;}
this.DETECT_KEY=_b?_b:"detectflash";
//this.skipDetect=deconcept.util.getRequestParameter(this.DETECT_KEY);
this.skipDetect=true;
this.params=new Object();
this.variables=new Object();
this.attributes=new Array();
if(_1){this.setAttribute("swf",_1);}
if(id){this.setAttribute("id",id);}
if(w){this.setAttribute("width",w);}
if(h){this.setAttribute("height",h);}
if(_5){this.setAttribute("version",new deconcept.PlayerVersion(_5.toString().split(".")));}
this.installedVer=deconcept.SWFObjectUtil.getPlayerVersion(this.getAttribute("version"),_7);
if(c){this.addParam("bgcolor",c);}else{this.addParam("wmode","transparent");}
var q=_8?_8:"high";
this.addParam("quality",q);
this.setAttribute("useExpressInstall",_7);
this.setAttribute("doExpressInstall",false);
var _d=(_9)?_9:window.location;
this.setAttribute("xiRedirectUrl",_d);
this.setAttribute("redirectUrl","");
if(_a){this.setAttribute("redirectUrl",_a);}};
deconcept.SWFObject.prototype={setAttribute:function(_e,_f){
this.attributes[_e]=_f;
},getAttribute:function(_10){
return this.attributes[_10];
},addParam:function(_11,_12){
this.params[_11]=_12;
},getParams:function(){
return this.params;
},addVariable:function(_13,_14){
this.variables[_13]=_14;
},getVariable:function(_15){
return this.variables[_15];
},getVariables:function(){
return this.variables;
},getVariablePairs:function(){
var _16=new Array();
var key;
var _18=this.getVariables();
for(key in _18){
_16.push(key+"="+_18[key]);}
return _16;
},getSWFHTML:function(){
var _19="";
if(navigator.plugins&&navigator.mimeTypes&&navigator.mimeTypes.length){
if(this.getAttribute("doExpressInstall")){this.addVariable("MMplayerType","PlugIn");}
_19="<embed type=/"application/x-shockwave-flash/" src=/""+this.getAttribute("swf")+"/" width=/""+this.getAttribute("width")+"/" height=/""+this.getAttribute("height")+"/"";
_19+=" id=/""+this.getAttribute("id")+"/" name=/""+this.getAttribute("id")+"/" ";
var _1a=this.getParams();
for(var key in _1a){_19+=[key]+"=/""+_1a[key]+"/" ";}
var _1c=this.getVariablePairs().join("&");
if(_1c.length>0){_19+="flashvars=/""+_1c+"/"";}
_19+=" pluginspage=/"http://www.macromedia.com/go/getflashplayer/"/>";
}else{
if(this.getAttribute("doExpressInstall")){this.addVariable("MMplayerType","ActiveX");}
_19="<object id=/""+this.getAttribute("id")+"/" classid=/"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000/" width=/""+this.getAttribute("width")+"/" height=/""+this.getAttribute("height")+"/" codebase=/"http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0/">";
_19+="<param name=/"movie/" value=/""+this.getAttribute("swf")+"/" />";
var _1d=this.getParams();
for(var key in _1d){_19+="<param name=/""+key+"/" value=/""+_1d[key]+"/" />";}
var _1f=this.getVariablePairs().join("&");
if(_1f.length>0){_19+="<param name=/"flashvars/" value=/""+_1f+"/" />";}
_19+="</object>";}
return _19;
},write:function(_20){
if(this.getAttribute("useExpressInstall")){
var _21=new deconcept.PlayerVersion([6,0,65]);
if(this.installedVer.versionIsValid(_21)&&!this.installedVer.versionIsValid(this.getAttribute("version"))){
this.setAttribute("doExpressInstall",true);
this.addVariable("MMredirectURL",escape(this.getAttribute("xiRedirectUrl")));
document.title=document.title.slice(0,47)+" - Flash Player Installation";
this.addVariable("MMdoctitle",document.title);}}
if(this.skipDetect||this.getAttribute("doExpressInstall")||this.installedVer.versionIsValid(this.getAttribute("version"))){
var n=(typeof _20=="string")?document.getElementById(_20):_20;
n.innerHTML=this.getSWFHTML();
return true;
}else{
if(this.getAttribute("redirectUrl")!=""){document.location.replace(this.getAttribute("redirectUrl"));}}
return false;}};
deconcept.SWFObjectUtil.getPlayerVersion=function(_23,_24){
var _25=new deconcept.PlayerVersion([0,0,0]);
if(navigator.plugins&&navigator.mimeTypes.length){
var x=navigator.plugins["Shockwave Flash"];
if(x&&x.description){_25=new deconcept.PlayerVersion(x.description.replace(/([a-z]|[A-Z]|/s)+/,"").replace(/(/s+r|/s+b[0-9]+)/,".").split("."));}
}else{try{
var axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash");
for(var i=15;i>6;i--){
try{
axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash."+i);
_25=new deconcept.PlayerVersion([i,0,0]);
break;}
catch(e){}}}
catch(e){}
if(_23&&_25.major>_23.major){return _25;}
if(!_23||((_23.minor!=0||_23.rev!=0)&&_25.major==_23.major)||_25.major!=6||_24){
try{_25=new deconcept.PlayerVersion(axo.GetVariable("$version").split(" ")[1].split(","));}
catch(e){}}}
return _25;};
deconcept.PlayerVersion=function(_29){
this.major=parseInt(_29[0])!=null?parseInt(_29[0]):0;
this.minor=parseInt(_29[1])||0;
this.rev=parseInt(_29[2])||0;};
deconcept.PlayerVersion.prototype.versionIsValid=function(fv){
if(this.major<fv.major){return false;}
if(this.major>fv.major){return true;}
if(this.minor<fv.minor){return false;}
if(this.minor>fv.minor){return true;}
if(this.rev<fv.rev){return false;}return true;};
deconcept.util={getRequestParameter:function(_2b){
var q=document.location.search||document.location.hash;
if(q){
var _2d=q.indexOf(_2b+"=");
var _2e=(q.indexOf("&",_2d)>-1)?q.indexOf("&",_2d):q.length;
if(q.length>1&&_2d>-1){
return q.substring(q.indexOf("=",_2d)+1,_2e);
}}return "";}};
if(Array.prototype.push==null){
Array.prototype.push=function(_2f){
this[this.length]=_2f;
return this.length;};}
var getQueryParamValue=deconcept.util.getRequestParameter;
var FlashObject=deconcept.SWFObject; // for backwards compatibility
var SWFObject=deconcept.SWFObject;

/*  |xGv00|70b54fe75de89df8e31d5ac6a9ea9d99 */

 

 

 

 

 

二、新浪FLASH广告

新浪手机频道FLASH广告JS调用代码(带文章标题)

<!--

var focus_width=277
var focus_height=200
var text_height=20
var swf_height = focus_height+text_height

var pics='图片地址一|图片地址二|图片地址三|图片地址四|图片地址五'
var links='链接地址一|链接地址二|链接地址三|链接地址四|链接地址五'
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 value="sameDomain"><param value="http://image2.sina.com.cn/bj/zonghe/pixviewer.swf"><param value="high"><param value="#F0F0F0">');
document.write('<param value="false"><param value="http://blog.techweb.com.cn/opaque">');
document.write('<param value="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'">');
document.write('<embed src="http://image2.sina.com.cn/bj/zonghe/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="'+ swf_height +'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />');
document.write('</object>');

//-->

我们可以看到,新浪手机频道FLASH广告JS调用代码和腾讯汽车频道FLASH广告JS调用代码完全一致,可见门户网站之间也是抄来抄去,技术是没有门户之见的。

需要注意的是,并不是所有的FLASH广告JS调用代码都是完全一样的,也取决于FLASH文件自身的调用定义,所以如果看到其他好看的FLASH广告形式,千万不要只是保存了FLASH就完事了,花点时间分析一下代码,对自己本身也是一种成长。

新浪彩信频道FLASH广告JS调用代码(不带文章标题)

<!--

var focus_width=234
var focus_height=135
var text_height=0
var swf_height = focus_height+text_height

var pics='图片地址一|图片地址二|图片地址三|图片地址四|图片地址五'
var links='链接地址一|链接地址二|链接地址三|链接地址四|链接地址五'
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 value="sameDomain"><param value="http://image2.sina.com.cn/bj/zonghe/pixviewer.swf"><param value="high"><param value="#ffffff">');
document.write('<param value="false"><param value="http://blog.techweb.com.cn/opaque">');
document.write('<param value="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'">');
document.write('<embed src="http://image2.sina.com.cn/bj/zonghe/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 +'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />');
document.write('</object>');

//-->

图片幻灯片切换特效代码三、网易FLASH广告

网易汽车频道FLASH广告JS调用代码(不带文章标题)

<!--

var focus_width=250;
var focus_height=160;
var pics = "图片地址一|图片地址二|图片地址三|图片地址四|图片地址五|";
var links = "链接地址一|链接地址二|链接地址三|链接地址四|链接地址五|";
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="'+ focus_height +'">');
document.write('<param value="sameDomain"><param value="http://cimg.163.com/auto/main-1.swf"><param value="high"><param value="#D6D3D6">');
document.write('<param value="false"><param value="http://blog.techweb.com.cn/opaque">');
document.write('<param value="pics='+pics+'&links='+links+'&focus_width='+focus_width+'&focus_height='+focus_height+'">');
document.write('<embed src="http://cimg.163.com/auto/main-1.swf" wmode="opaque" FlashVars="pics='+pics+'&links='+links+'&focus_width='+focus_width+'&focus_height='+focus_height+'" menu="false" bgcolor="#D6D3D6" quality="high" width="'+ focus_width +'" height="'+ focus_height +'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />');
document.write('</object>');

//-->

注意,细心的朋友可以看出网易汽车频道FLASH广告JS调用代码和以上门户网站的区别吗?

图片幻灯片切换特效代码四、搜狐FLASH广告

搜狐体育频道FLASH广告JS调用代码(带文章标题)

<!--

var focus_width=240
var focus_height=190
var text_height=21
var swf_height = focus_height+text_height
var pics='图片地址一|图片地址二|图片地址三|图片地址四|图片地址五'
var links='链接地址一|链接地址二|链接地址三|链接地址四|链接地址五'
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 value="sameDomain"><param value="http://business.sohu.com/upload/focus.swf"> <param value="high"><param value="#CCCCCC">');
document.write('<param value="false"><param value="http://blog.techweb.com.cn/opaque">');
document.write('<param value="pics='+pics+'&links='+links+'&texts='+texts+'&borderwidth='+focus_width+'&borderheight='+focus_height+'&textheight='+text_height+'">');
document.write('<embed src="http://business.sohu.com/upload/focus.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="'+ swf_height +'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />'); document.write('</object>');
//-->

抱歉!评论已关闭.