(四)讓Flash網站具有IE前進後退的功能

前言

寫完流量統計的教程以後,本以爲會很輕鬆地就可以完成該篇文章。後來才發現,原來還是遇到了困難。因爲要通過iframe控制主HTML的變量,一開始,考慮到打開父窗口用的是_parent,而Flash裏的父級也是_parent,於是理所當然地以爲iframe訪問主html也是通過_parent,結果,弄了很久,還是提示_parent未定義。
爲此,我百度了下,看如何通過iframe訪問主html。暈,原來這個是沒有下劃線的,於是改了下,發現有新的問題,就是提示“沒有權限”的錯誤。在之前玩反編譯的遊戲中遇到了這個問題,是跨域訪問導致的。奇怪了,我的文件都在本地啊,怎麼不行呢?折磨了半小時,決定還是用IIS來測試吧。嗯,IIS成功了。難道file協議也沒有權限?還是識別不了域名?這個我就沒研究下去了。

效果預覽(應wolf2999的要求,這次我就不放超女的東西上去了,而且我網站現在加這功能還有點麻煩,因爲結構有點複雜:
http://hbro.cincn.com/hbro/cours ... ex_flash.html#page1

點左邊一排的按鈕,你會發現在動畫效果跳轉的過程中,地址欄發生了改變,但是明顯的是Flash沒有刷新,同時後退按鈕已經可用。你多點幾次以後,嘗試按後退按鈕,Flash也同樣不刷新,但是它會依此通過動畫跳轉到你之前點過的page。
這樣,就是通過IE的按鈕控制Flash的程序了。但是,實質上,是有個iframe在刷新的,所以,如果網速慢,並且點得很快,就將導致某些頁面給跳過。

實現原理

找了很多方面的資料,本來想向IE的歷史記錄里人爲添加asfunction協議的地址,但是發現似乎不可能,在Digi的提點下,我知道了可以通過刷新iframe來達到控制的目的。其過程爲:

  • 在Flash裏點擊一個所謂的鏈接,執行一個動作。該狀態的一些參數用getURL到iframe裏的一個固定頁面。比如說,我點了page1,那麼getURL的地址將是statistics.html?page1
  • 點擊幾次以後,iframe其實已經刷新了幾次,於是纔會啓用後退的功能,這個時候,其實iframe已經打開過了幾個頁面,假如你依此點了page1,page2,page3,page4這四個按鈕,那麼,iframe就瀏覽了statistics.html?page1,statistics.html?page2,statistics.html?page3,statistics.html?page4這四個頁面了。最終定位在statistics.html?page4
  • 此時點IE的後退按鈕,iframe將返回statistics.html?page3。但是單純這樣並不會讓Flash受到控制。所以,我們需要在statistics.html打開的時候,啓用一個控制Flash的函數,就實現IE後退的功能了。前進的道理也一樣。
  • 具體做法

    1.1 新建一個Flash文檔,保存爲index_flash.fla

    1.2 在該文檔裏新建一個MC,名爲pagesButtons_clip,在裏頭放一個按鈕,寫入代碼:

    on (release) {
           _parent.loadNews(_name);//該函數用於Flash內的頁面跳轉。
       }

    1.3 再載入一個動態文本,變量名爲_name

    1.4 在主場景裏放入四個pagesButton_clip,分別命名爲page1,page2,page3,page4

    1.5 在主場景新建一個MC,實例名爲pages,在裏頭放入實例名爲page1,page2,page3,page4的MC。

    1.6 在適當的位置給pages建立一個遮罩mask。

    1.7 下面可以寫代碼了,這次跳轉,我會讓相應的page定位至mask那裏,從而讓該頁面顯示,其它則隱藏。
    主場景的幀裏寫:

    var initx = mask._x;//首先定位一個初始點,這是頁面定位的常量
    var inity = mask._y;//同上
    var targetx=initx;
    var targety=inity;//這兩個變量也用於定位,使用韓式緩衝公式算法,可以讓MC緩慢地移動到(targetx,targety)這一點。
    this.onEnterFrame = function() {
           pages._x = pages._x-0.2*(pages._x-pages.targetx);
           pages._y = pages._y-0.2*(pages._y-pages.targety);
    };//這個則是緩衝公式
    function loadNews(href) {//定義按鈕觸發的函數
           pages.targetx = initx-pages[href]._x;
           pages.targety = inity-pages[href]._y;//先讓target定位至當前MC(也就是傳入的參數href),然後緩衝公式會讓當前傳入的MC顯示出來,其它的則隱藏
           fscommand("setAddress", href);//設定地址欄內容,用於刷新頁面時的定位,在JS裏會響應這一命令。
           getURL("statistics.html?"+href, "stat");//打開iframe,讓iframe記錄當前點到的MC的實例名href
    }

    2.1 以帶有fscommand跟蹤的Flash發佈一個HTML文件和一個SWF文件,接着把發佈設置中格式選項卡的HTML勾去掉。

    2.2 用記事本打開index_flash.html文件,找到//place your code here 一句。寫入

    if(command=="setAddress"){
              document.location.hash=args
            }

    2.3 然後定義一個onLoad執行的函數JS_LoadNews

      function JS_LoadNews(){
      window.open("statistics.html?"+document.location.hash.slice(1),"stat")//讓名爲stat的iframe打開一個帶參數的地址
    }

    2.4 根據上一步的JS,加一個iframe

    <iframe noscroll border="0" src="about:blank" width="1" height="1" name="stat" id="stat"></iframe>

    2.5 在body標籤里加onload=JS_LoadNews()

    3.1 新建一個HTML文件,名爲statistics.html,在這裏寫入控制Flash的代碼:

    <script language="javascript">
      function pageLoad(){
        window.parent.index_flash.setVariable("link",window.document.location.search.slice(1))//parent指父級框架,這裏可以指向FLASH文件,location.search是獲取地址參數,該值包含“?”,所以用slice(1)去掉。
      }
    </script>
    <body onload=pageLoad()>
    </body>

    3.2 上面的代碼設置了Flash裏的link值,爲了觸發Flash的函數,在Flash裏用addProperty來觸發相關函數:
      追加幀代碼:

     

     

      this.addProperty("link", getLink, setLink);
    function getLink() {
    }
    function setLink(link) {
           fscommand("setAddress", link);
           pages.targetx = initx-pages[link]._x;
           pages.targety = inity-pages[link]._y;
    }

     

    經典論壇討論
    http://bbs.blueidea.com/viewthread.php?tid=2670755

出處:藍色理想 

(一)AS+JS的Flash網站無刷新定位技術  
(二)Flash網站的SEO
(三)Flash網站的流量統計
(四)讓Flash網站具有IE前進後退的功能
(五)圖片輪換效果

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章