不知道寫什么，主要也是自己水平實在是有限，想想自己會的東西都太基本，網上一搜往后不知道能數多少頁，自己表達的也沒有別人好。我希望自己寫的東西要么是網上沒有(可能性就是零……)，要么是帶着自己的見解。所以沒有素材，還是自己踏踏實實學習比較靠譜，看的書越多，發現自己不會的也越多，但是太長時間不發東西出來又害怕自己丟失了寫文章的習慣，所以湊數也要湊一篇！
開頭講了這么多，就是做了鋪墊，這個HTML5播放器很水……就是為了湊一篇博文素材加上這是我第一個上傳到github上的項目……
github地址：https://github.com/westAnHui/HTML5-Player
功能很普遍，這玩意又不難，先看截圖，如果覺得丑就不用看了0.0
本文不包含介紹HTML5播放器這方面的API，那個網上一搜一大摞……
注意：上一個(左箭頭)，下一個(右箭頭)、全屏還沒寫，未完成版……原諒我偷懶先放出來了，其他功能基本上都實現了
——————————————————————————————————————————————————————————————
很簡單，幾個基本的按鈕，懸停按鈕時發光用了border-radius和box-shadow配合，總進度條和音量進度條使用自定義拖拽
也有幾點收獲
比如：
box-sizing:border-box是真心的好用啊，特別對於有些在父級寬高未知，子元素需要填滿，不過子元素自身有border和padding，這樣無腦width或height設置為100%，那就超了~但是加上box-sizing:border-box世界就清靜了~
transform:translate(-50%, -50%)，這個也是棒的不行，偏移的50%是針對子元素本身的，不需要知道自己的寬高數值就可以。配合top:50%，left:50%，position:absolute立馬達到垂直居中！，相比較margin:-(需要知道自己本身寬高再除2)%，方便了很多！
js是寫在window.onload里面的
注意：如果不用window.onload，在DOM加載完畢之后直接跑的話，是讀不到總視頻時間的
video.duration的結果是undefined
視頻和圖片是一個性質嘛~無聊測試了一下本機環境下延遲40ms就可以讀了，不過這毫無用處……
最后給個GIF
