如何使網站背景音樂換頁時不間斷

On 2011/05/22, in HTML, by Allen J

有些網站偏重娛樂效果
在網站裡會加入元件動態、轉頁效果、背景音樂
例如:商業網站、活動網站、個人網站、Blog等等

現在網站大致有分HTML和全FLASH這二種
用FLASH來製作活動網站是很不錯
動態變化兼具聲色效果
缺點是吃效能、下載速度、平台支援性等問題

目前HTML網頁可以搭配jQuery、Ajax等套件
使得傳統網頁也能動起來
HTML網頁的架構是一頁一頁去傳送資料給瀏覽者
當瀏覽者點下連結時
會將整頁的資料全部重新載入
而背景音樂就會被迫中斷重新播放
像無名小站的blog(王瞳)
一直換頁音樂會一直重新播放

解決這個問題
我想到的方式是Ajax、Frameset
可避免網頁整個重新載入
就可保留音樂持續播放不間斷囉~~
以下是用Frameset的方式

<frameset framespacing="0" name="mainframeset" id="mainframeset" border="0" frameborder="no" rows="*,1">
	<frame name="mainframe" src="index_sub.html">
	<frame name="soundframe" src="sound.html">
</frameset>

index_sub.html:主要的網頁
sound.html:放背景音樂的網頁,高度是1,會固定在瀏覽器的下方,等於是隱藏的網頁

如果在主網頁裡要控制音樂的播放
可以利用Javascript的方式
跨Frame去呼叫function
例:parent.soundframe.play_music(on);
index_sub.html去呼叫sound.html的play_music方法

使用Frameset的網站:FINAL FANTASY LEGENDS | SQUARE ENIX

標籤: