H5 音樂播放器：ajax 實(shí)戰(zhàn) 妙味課堂

show0p

H5 音樂播放器：ajax 實(shí)戰(zhàn)  妙味課堂
價值：229   附帶課件

游客，如果您要查看本帖隱藏內(nèi)容請回復(fù)

課程介紹
本次課程涉及的知識點(diǎn)包括：移動端H5、CSS3、JS、滑屏、HTTP協(xié)議、AJAX、跨域、前后端交互、PHP、mySql、jQuery……配合這些知識點(diǎn)，講師寫了一個H5播放器demo，用來演示一個H5播放器究竟如何運(yùn)用這些技術(shù)。

學(xué)習(xí)目標(biāo)
課程案例演示僅展示了授課過程中“播放歌曲功能、歌詞同步功能、拖拽播放進(jìn)度功能、暫停播放功能、歌曲切換功能、留言功能”，大家學(xué)完以后可以動手嘗試制作一款類似的H5音樂播放器。

課程詳情
本次課程涉及的知識點(diǎn)包括：
移動端H5、CSS3、JS、滑屏、HTTP協(xié)議、AJAX、跨域、前后端交互、PHP、mySql、jQuery……配合這些知識點(diǎn)，講師寫了一個H5播放器demo，用來演示一個H5播放器究竟如何運(yùn)用這些技術(shù)。

課程案例：
以下演示僅展示了授課過程中“播放歌曲功能、歌詞同步功能、拖拽播放進(jìn)度功能、暫停播放功能、歌曲切換功能、留言功能”，而其他許多商業(yè)播放器的功能并未全部完成，畢竟此案例僅作教學(xué)之用，因此許多產(chǎn)品交互體驗(yàn)上的細(xì)節(jié)講師并未開發(fā)，特此說明。

課程大綱：

第一課：
傳統(tǒng)交互與ajax對比
什么是ajax
同步與異步
搭建wamp環(huán)境
前后端交互原理
PHP基礎(chǔ)語法
MYSQL基礎(chǔ)語法
GET和POST
XMLHttpRequest
open
onreadystatechange
send
HTTP協(xié)議
readyState
status
statusText
responseText
JSON.parse
setRequestHeader
jquery中ajax使用方式
第二課：
PHP與MYSQL深入
搭建項(xiàng)目初始數(shù)據(jù)
兼容PC與移動端
列表頁制作
ajax方式初始化列表
第三課：
模擬緩沖滑動
播放器制作
播放時間與進(jìn)度
ajax方式請求對應(yīng)歌曲
第四課：
同步歌詞制作
左右劃屏制作
留言板制作
關(guān)聯(lián)表創(chuàng)建
ajax方式初始化留言
ajax方式添加留言
第五課：
完善項(xiàng)目和BUG修復(fù)
XMLHttpRequest2
onload
timeout
ontimeout
responseType
response
mimeType
上傳文件方式
FormData
progress
跨域jsonp
跨域cors
復(fù)制代碼


課程目錄
1H5音樂播放器-ajax實(shí)戰(zhàn)
1-Ajax與后端基礎(chǔ)
2-Ajax基本使用
3-PHP和MYSQL擴(kuò)展
4-播放器搭建及初始數(shù)據(jù)
5-播放器細(xì)節(jié)處理
6-移動端滑屏原理
7-音樂詳情頁搭建
8-音樂詳情頁數(shù)據(jù)填充
9-音樂進(jìn)度條原理
10-歌詞操作原理
11-添加留言
12-添加留言及橫豎屏切換
13-播放列表懶加載
14-XMLHttpRequest2
15-Ajax跨域

2442159921

好東西看看吧

lonelyboy568

[『編程開發(fā)』] H5 音樂播放器：ajax 實(shí)戰(zhàn) 妙味課堂

xx0203

祝資源共享吧越來越火！

qq45566393

樓主雷鋒啊，謝謝分享

上善若水

樓主雷鋒啊，謝謝分享

mohui66688

sda

Scorpio

感謝樓主的無私分享！

xiange

這個可以噢