當前位置：首頁 > 前端技术 > javascript >内容正文

javascript

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

發布時間：2024/1/17 javascript 36 豆豆

生活随笔收集整理的這篇文章主要介紹了各大门户网站Flash和JS实现的图片幻灯片切换特效代码文件下载: 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

最近看到各大門戶站都有一個幻燈片特效，而且不是簡單的ＪＳ特效，是ＦＬＡＳＨ和ＪＳ結合而成的覺得非常不錯，今天在ＩＴ世界的原代碼中查看了一下，特此發布！希望大家喜歡！有什么問題可以與我研究！

<a?target=_self?href="goUrl()">
????????????????????<span?class="f14b">
????????????????????<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?name="allowScriptAccess"?value="sameDomain"><param?name="movie"?value="http://www.webjx.com/js/focus.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="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>');
?

?</script>
????????????????????</span></a><span?id=focustext?class=f14b>?</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調用代碼（帶文章標題）
?

????以上代碼中，用戶可以分別指出圖片地址，鏈接地址和文章標題

????騰訊音樂頻道FLASH廣告JS調用代碼（不帶文章標題）



????以上代碼中，用戶可以分別指出圖片地址，鏈接地址。

????圖片幻燈片切換特效代碼二、新浪FLASH廣告

????新浪手機頻道FLASH廣告JS調用代碼（帶文章標題）



????我們可以看到，新浪手機頻道FLASH廣告JS調用代碼和騰訊汽車頻道FLASH廣告JS調用代碼完全一致，可見門戶網站之間也是抄來抄去，技術是沒有門戶之見的。

????需要注意的是，并不是所有的FLASH廣告JS調用代碼都是完全一樣的，也取決于FLASH文件自身的調用定義，所以如果看到其他好看的FLASH廣告形式，千萬不要只是保存了FLASH就完事了，花點時間分析一下代碼，對自己本身也是一種成長。

????新浪彩信頻道FLASH廣告JS調用代碼（不帶文章標題）



????圖片幻燈片切換特效代碼三、網易FLASH廣告

????網易汽車頻道FLASH廣告JS調用代碼（不帶文章標題）



????注意，細心的朋友可以看出網易汽車頻道FLASH廣告JS調用代碼和以上門戶網站的區別嗎？

????圖片幻燈片切換特效代碼四、搜狐FLASH廣告

????搜狐體育頻道FLASH廣告JS調用代碼（帶文章標題）

轉載于:https://www.cnblogs.com/ginowang42/archive/2009/12/15/1624258.html

總結

以上是生活随笔為你收集整理的各大门户网站Flash和JS实现的图片幻灯片切换特效代码文件下载:的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇：【深入浅出WF】——令牌环的变身—书签
下一篇： gradle idea java ssm