Flash轉Html5背景透明

2   Comments

HTML5
將Flash轉成Html5的幾個工具中, Swiffy是比Wallaby, Create JS好用許多, 而且Google很認真地一直改版進化. 也許Google會比Adobe更早完成Html5的統一包裝目標. (不可諱言的, Html5的資源效能比Flash還膨脹, 各家瀏覽器也不見得統一支援)
但是Swiffy畢竟不是直接由HTML5的標籤寫成的, 轉檔後的背景為了支援SVG或base64編碼圖形, 勢必不能透明. 就一般了解, HTML網頁是不需要透明的.
但,如果這個內嵌網頁恰巧當作物件使用, 懸浮在主頁上層; 內容物又正巧不是方正格局的網頁, 那麼透明就顯得必要...

舉個例子:當我把一個內嵌網頁當作Flash來使用. 載入主網頁後可以跳出廣告一次, 或是來段無背景框動畫-正妹熱舞的效果(最好是猛男脫衣).
這時候懸浮在最上層的這個內嵌網頁背景不透明的話就太遜了!!!

一般在網頁裡標註透明即可, 如下:


<iframe
allowtransparency="true" border="0" frameborder="0" height="xxx" scrolling="no" src="http://iframe.html" width="xxx"></iframe>


或是在 <body> 裡面加註 <style>


<body style="background:transparent">


不過以上方法對Swiffy轉檔後的HTML網頁無效...
要將html檔案用notepad記事本打開, Ctrl+F 找到 "background" 這一段. 將色標改成 "backgroundColor": undefined  如圖:

swiffy
順便多事提醒:在製作Flash動畫時, 最好設定FPS=12, 設定成24或是更高的影格率並不會讓轉檔後的html檔案更流暢; 只會讓不同瀏覽器呈現快慢不同的狀況.
Ctrl+F 找到 "FrameRate" 調整播放速度.

* 此篇才發佈幾天, Swiffy就更新到v4.5版, 讓上述方法失效... runtime.js - v4.5 以後的版本將 "backgroundColor": 色碼, 這一段刪除即可. 


Swiffy 5.2 版本開始, 背景透明不可刪除 "backgrounfColor": -1, 此段.
打開HTML檔案, 拉到頁末將下段樣式加入 <style> 裡面, 如附圖:
#swiffycontainer div {background-color: transparent !important;}


Swiffy to HTML5 background transparency

Update:Swiffy background transparent


Author Summary
Flash轉Html5背景透明
Subject : Flash轉Html5背景透明
Author : - Dream Talker Updated at: 12:44 PM
Votes : 100% - 5.0 - based on 2015
Flash轉成HTML5網頁格式後,讓HTML5動畫仍抱持透明的語法.使動畫執行時不遮蔽網頁而呈現背景透明效果
5 Stars - Reviews
留言提示 - Comment Tips
◆ 如果您有任何想法或意見,歡迎參與留言。
◆ Disqus匿名留言,信箱及個人資訊不會公開顯示。
◆ 請多使用社群帳號留言,可簡化流程並訂閱回復。
◆ 『私密留言』請使用Google+分享按鍵,留言須使用『@Mark X』在訊息中,以免遺漏通知。
◆ G+ 訊息中指名分享對象的參考文件: 『 說明
  • Disqus
  • Blogger
  • Facebook
Anonymous left your nick please
  1. 謝謝您,終於找到背景透明的改法。

    ReplyDelete