[請益] 製作動態歌詞的想法.Javascript

看板Web_Design作者 (Maxis)時間13年前 (2011/08/06 11:34), 編輯推噓0(0023)
留言23則, 5人參與, 最新討論串1/1
最近想弄一個動態歌詞的效果 目前想法是 將每行歌詞設成一個 <div><span>setInterval 改變 css 的 top 值 (就可以往上捲動) 但每行停留時間不同 是否需要一個時鐘專門計時 然後用另一個來控制捲動 以及將目前歌詞的套色 懇請板上高手們指點迷津!! :D -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 61.230.184.178 ※ 編輯: upp818 來自: 61.230.184.178 (08/06 11:35)

08/06 12:10, , 1F
感覺上是一個 timer 就夠了 :P
08/06 12:10, 1F

08/06 12:19, , 2F
可以參考播放器跟字幕(如.srt檔)兩者關係的做法~
08/06 12:19, 2F

08/06 12:23, , 3F
這東西我很感興趣XD 應該可以找到一些套件來做移動特效
08/06 12:23, 3F

08/06 12:29, , 4F
我正在寫...:P 感覺是簡單的東西
08/06 12:29, 4F

08/06 12:48, , 5F
當然 我說的是陽春版 :P
08/06 12:48, 5F

08/06 13:02, , 6F
timer寫好了 :P 不過少爬一個pattern .. 然後再來做簡易板的
08/06 13:02, 6F

08/06 13:03, , 7F
卡拉效果..
08/06 13:03, 7F

08/06 13:06, , 8F
啊 原po想要的應該是桌面歌詞 (會往上卷的)那種:P
08/06 13:06, 8F

08/06 13:06, , 9F
不過我現在寫的是比較接近k歌的那種 不過要切應該也不難..
08/06 13:06, 9F

08/06 13:26, , 10F
http://jsfiddle.net/CVAHk/4/ 程式碼還沒調過 :P
08/06 13:26, 10F

08/06 13:26, , 11F
不過大意在於 設計的時候應該針對時間軸去顯示
08/06 13:26, 11F

08/06 13:27, , 12F
這種有時間觀念的 切frame 去做感覺比較理想
08/06 13:27, 12F

08/06 13:28, , 13F
目前只支持一行一個時間的動態歌詞 (因為測資是這個 XD)
08/06 13:28, 13F

08/06 13:28, , 14F
不過要修他,只要改 parseLyric 函式就好了 :P
08/06 13:28, 14F

08/06 13:28, , 15F
另一個是跑馬燈的實作隨便了一點(遮臉)
08/06 13:28, 15F

08/06 13:29, , 16F
如果要改成scrolltop , 應該是把 show 這個函式抓出來修
08/06 13:29, 16F

08/06 13:36, , 17F
用firefox 看吧 忘了考慮它被flash遮住的情況 ~_~
08/06 13:36, 17F

08/06 16:34, , 18F
好棒 可惜要快速的按MV play+歌詞play 兩個按鈕要近一點
08/06 16:34, 18F

08/06 20:16, , 19F
youtube不知道有沒有可以控制的API..
08/06 20:16, 19F

08/06 22:04, , 20F
youtube player api http://bit.ly/oOFZwI 可以抓播放時間
08/06 22:04, 20F

08/07 06:28, , 21F
修了一個抓youtube 時間的版本 XD
08/07 06:28, 21F

08/07 06:28, , 22F

08/07 16:03, , 23F
我真是太驚喜了 讚讚
08/07 16:03, 23F
文章代碼(AID): #1EFBPXn8 (Web_Design)