*YouTube 教學頻道* *影像布落格*
首頁
初學者技能教案專區
布落格寫作
數位影音專題寫作
西洋哲學史導讀
老子探義導讀
《論語》小談
flickr圖像集

2013年5月8日 星期三

動靜之間的照片:使用HTML5的影音功能


動 靜 之 間 的照片
既是圖像又是video;既不是圖像又不是video

「動 靜之間的照片」,這個「詞 or 術語」我也想了很久才定了心;最重要是想表達一種新形式的圖像呈現模式。如下:



這是 我在 研究某一網站文本形式時,看到的一種圖像的表現形式。
非常有「張力」。
靜態圖像與影音圖像的矛盾,融燴成一種另一意想不到的意義呈現樣態。
網路數位文本的創作樂趣也在於此!More!!
而這種圖像表現方式若和文字配合的好,帶出了一種感受意義的全新模式。



 創作技能思考方 向:

這其實是以影音檔來創作,只是將照片的播放時間拉長。
以HTML5的影音功能加以變化,來模擬這種動靜之間的照片表現。



 影音教學


一般使用語法:
<video width="460" height="345"  loop="loops" autoplay="autoplay">
<source
src="http://newsweek.shu.edu.tw:8080/lmcsilver20121007/video201210/201305081509.mp4"
type="video/mp4"></source>
</video>

KompoZer使用語法:
<object  height="345" width="460">
<video width="460" height="345" loop="loops" autoplay="autoplay">
<source
src="http://newsweek.shu.edu.tw:8080/lmcsilver20121007/video201210/201305081509.mp4"
type="video/mp4"></source>
</video>
</object>

影音教學說明:

1. controls="controls" 是指在影音內出現控制欄。loop="loop" 是指重覆播出。 autoplay="autoplay" 是指自動播出。不想用的功能就不要寫進去就好。例如此例,就沒有把controls="controls" 寫入,所以在影像畫面內不會有影音控制欄。
2.  <source src="xxx"></source> xxx是影片的位置網址。width="xxx" 寬度和 height="xxx" 高度要記得寫。
3. 影片請用MP4格式。
4. KompoZer的語法多出了<object width="xxx" height="xxx">xxx</object>。這是為了更方便在KompoZer的所見即所得排版功能。


沒有留言:

張貼留言