☞ 公 告 ☜
有一陣子似乎很流行讓家族、自己個人網頁下面嵌入一個音樂播放器，
這樣一來，當網頁換頁的時候，音樂不會隨之ㄎㄚ(Cut)掉，而這也是很多人所希望的
，很多人不希望音樂隨著更新網頁或是按某個指令而停止。
所以Tiffy現在要來寫
這一個教學，如何在你的個人網頁下也放一個撥放器, 其實做法很簡單, 而且Tiffy也
在奇摩知識上寫過不下十次, 可是還是有人跨無… 不知道是因為純文字寫法讓人看到
眼花, 還是.. 懶惰病發作…不管事實如何，要知道, 不可能請求別人作每一件事情，
而且自己若沒有親身體驗，或是嘗試過，對你來講, 他總是個大難題，所以,…呵呵~
不多說, 我們來玩玩吧
首先，請去網路上找.. 各式各樣的音樂撥放器, 以Exobud播放器為主
好了，我以一個撥放器為例
連結請點..咖啡杯觀看
我們要先去下載音樂撥放器的面板，通常是個壓縮包，解壓縮後，你會
發現資料夾裡面有一個資料夾、四個js文件、兩個CSS樣式檔案、兩個htm網頁及兩個
readme的文字檔。
若是您沒有壓縮檔RAR請到
幻象馬雅
BBS下載
若是您還沒找到理想的撥放器,
這裡有個播放器可以試試看:請按此 下載
安裝程序:
首先你要先去你的網頁空間裡面建立一個
資料夾，為了方便我們的解說, 我們把這個資料夾稱為exobud_1，
在建立了這個exobud_1資料夾後，我們還要在裡面再新增一個資料
夾稱之為img，請不要命名其他名稱，因為這是為了配合裡面的js,
css, 跟html檔案內的指令而取的。
新增完成這兩個資料夾後, 請把剛剛解壓縮好
的資料夾，其中裡面的img圖片檔案通通上傳到你的網頁空間裡面的
img資料夾。
第二個步驟:
再來把以下的文件上傳至
exobud_1資料夾內；
- exobbud.html→exobud MP 播放面板HTML頁面檔案
- exobud.css→exobud MP播放面板CSS樣式表
- exobudpl.html→exobud MP播放清單HTML頁面檔案
- exobudpl.css→exobud MP撥放清單CSS樣式表
- exobud.js→exobud MP撥放程式主程式
(javascript)
- exobudpl.js→exobud MP播放清單設定檔
(javascript)
- exobudset.js→exobud MP撥放程式基本設定檔
(javascript)
- imgchg.js→動態按鈕圖檔切換動作的程式檔(javascript)
你會在壓縮檔案中看到如上的八個文件,而這八個文件當
中主要有修改的項目有如下幾個︰
exobud.html: 主要的呼叫HTML執行檔，
在網頁端呼叫各個JS指令檔以及CSS樣式表，進而讓播放器產生作用，這個文件可修改
在播放器所出現的文字訊息，例如按鈕的輔助說明
exobudpl.html: 配合播放器主文件使用
的歌曲列表清單，裡面崁入了一個js程式，這個程式主要修改在播放清單中所指示的訊
息，此程式位於程式資訊及版權宣告項目之下，請自行開啟exobudpl.html，查看，基
本上市無須修改，如有必要，請依照您當時所編輯的網頁環境作適當的修改即可
exobud.css/exobudpl.css: ExoBUD MP 播放面板 CSS 樣式表，此樣式表主要在修改背景圖以及
顯示文字的顏色、大小，到訪以及未到訪的文字顏色標記
exobudset.js: ExoBUD MP 播放程式基
本設定檔，可設定一進入頁面是否自動播放，是否跳出顯示媒體資訊的對話方塊，當所
有曲目播放完畢是否在自動重新播放，一開始是否要設定隨機播放或按照順序沿路播放
下去
exobudpl.js: 歌曲載入的設定檔，不支援
RA~RM~RAM的音樂格式，其餘皆可
這些檔案真正需要修改的只有exobudset.js跟exobudpl.js,
打開exobudpl.js的時候, 捲軸往下拉, 其實你會發現裡面都有中文註解了, 其
中裡面有幾句話是
// [T1] 下面這一行是使用一般的設定格式來設定播放清單
項目 (是項設定只能在本機正常顯示字幕，在正式使用時請參考上述第2點之說明
)
mkList(“./sample/seattle.wmv”,”Great Reasons to Visit Seattle (含字幕
)”);
// [T2] 下面這一行同樣使用了一般設定格式，但是媒體檔
案位置並不是位於程式所在的主機
mkList(“http://tjap.bugsmusic.co.kr/japmusic/cha/0F/cha0F176370.asf”,”F4 – 流星雨”);
// [T3] 下面這一行使用了最精簡的設定格式，媒體的標題
將會自動從媒體檔案本身直接讀取
mkList(“./sample/seattle.wmv”);
// [T4] 下面這一行使用了完整的設定格式，在第四個設定
值中的 “f” 表示這個媒體檔案並不會預設播放，但使用者仍可以在播放清單上選擇是
否播放
mkList(“http://tjap.bugsmusic.co.kr/japmusic/cha/0F/cha0F176375.asf”,”F4 – 第一時間”,””,”f”);
// [T5～T10] 下面提供的幾首都是驚直喜愛的『新世紀音樂
』，做為樣本播放清單的額外曲目^^
mkList(“http://web0.puckii.net/puckii/118/118534.tm$”,”Yuichi Watanabe – Last Kiss”);
mkList(“http://web0.puckii.net/puckii/118/118535.tm$”,”Yuichi Watanabe – Raindrops”);
mkList(“http://tpop.bugsmusic.co.kr/popmusic/pop/0B/pop0B74619.asf”,”Brian Crain – Butterfly Waltz”);
mkList(“http://tpop.bugsmusic.co.kr/popmusic/pop/0B/pop0B86787.asf”,”Brian Crain – Northern Lights”);
mkList(“http://web0.puckii.net/puckii/16/16970.tm$”,”Kevin Kern – Bittersweet”);
mkList(“http://web0.puckii.net/puckii/16/16973.tm$”,”Kevin Kern – Passages”);
// 以上所有開頭為 http:// 的串流音樂檔案連結，都是由
韓國的一些網路音樂分享社區免費提供的。
// 當您播放這些曲目的時候，並不一
定保證上列的串流音樂檔案連結，全部都能夠正常連線，亦不排除檔案位置已變更。
// ══════════════════
這邊就是你修改音樂的地方, 把你找到的音樂網址, 替代上
面的http:// 音樂網址, 若是怕太混亂不清楚, 可以把上面這幾段裡面的//[T1]跟中文
等字樣刪除並儲存, 只留下mkList(“http://音樂網址”,”歌名”);即可。
如果想要讓音樂連續撥放或是隨機撥放亦或是自動撥放, 請
打開exobudset.js,內有詳細說明. 設定完請記得存檔
再來我們要做兩個網頁, 一個是你想呈現的主頁, 一個
是有你的主頁跟撥放器在一起的網頁； 請先在你的網頁空間新增一個html的網頁命名
為top.html
其語法為:
<META
HTTP-EQUIV=”content-type” CONTENT=”text/html;
charset=big5″>
網頁名稱
<FRAME
MARGINWIDTH=0px>
<body topmargin=0px bgcolor="#ffffff"
text=”#000000″>
<IFRAME style="WIDTH=100%; HEIGHT=100%"
framborder=0px align=left src=”http://你的網頁空間或是家族網址”
scrolling=yes>
|
另一個有你的主頁跟你的撥放器的網頁是利用框架的方式作
成的, 需要把你要的網頁跟撥放器嵌在一起, 圖片如下:
其語法為:
<meta
http-equiv=”Content-Type” content=”text/html;
charset=big5″>
個人網頁名稱/家族名稱
<frameset framespacing="0" border="0"
rows=”*,29″ frameborder=”0″>
<frame name="top" src="top.html"
target=”_self”>
<frame name="bottom" src="http://下面所顯示的exobud網址exobud.htm” scrolling=”auto”
target=”_self”>
其中的
29是指撥放器的高度
src=”top.html” 指的是剛剛設定的top網頁
exobud.htm網頁即是你剛剛在exobud_1裡面上傳的
exobud.htm, 找到他的網址貼上即可,
不過, 想要聽音樂. 也只能到你所作好的有主頁
跟有撥放器的網頁才可以邊聽音樂邊瀏覽網頁唷! 若是由原本的連結連的話, 就聽不到
音樂囉!
如果嫌棄網頁連結有點過長不美觀, 可以利用縮
短網址來美化一下
教學完畢，下臺一鞠躬! 有問題請直接留言或是
寫信給我。
By Tiffy©2006 All Rights
Reserved