成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

多媒體編程

Kosmos / 2330人閱讀

摘要：多媒體和圖形編程這個(gè)屬于在客戶端生成圖片，可以減少服務(wù)器的壓力腳本化圖片頁面使用元素，嵌入圖片。表示在瀏覽器中是否顯示控件為顯示，為隱藏，查詢媒體狀態(tài)他們有一些只讀的屬性，描述當(dāng)前的狀態(tài)。

多媒體和圖形編程
這個(gè)屬于在客戶端生成圖片，可以減少服務(wù)器的壓力

腳本化圖片

web頁面使用img元素，嵌入圖片。
img元素可以通過控制src屬性來操控img。
一個(gè)栗子，鼠標(biāo)經(jīng)過的時(shí)候，改變圖片

當(dāng)鼠標(biāo)經(jīng)過的時(shí)候，會(huì)觸發(fā)兩個(gè)事件，分別是onmouseover以及onmouseout兩個(gè)

html如下




    這是一個(gè)模擬圖片翻轉(zhuǎn)的dome

使用上方的兩個(gè)標(biāo)簽實(shí)現(xiàn)簡(jiǎn)單的視頻和音頻的插入

由于標(biāo)準(zhǔn)的執(zhí)行問題，所以使用source標(biāo)簽實(shí)現(xiàn)兼容
文檔 https://developer.mozilla.org...
下方是一個(gè)兼容的實(shí)現(xiàn)

Audio構(gòu)造函數(shù)

Audio()構(gòu)造函數(shù)類似Image()函數(shù)
例如

new Audio("./chime.wav").play();    // 載入并播放聲音效果

這是音頻的api，視頻沒有這個(gè)api

類型選擇和加載

使用的是canPlayType進(jìn)行的
原型為 HTMLMediaElement.canPlayType()
能播放返回一個(gè)真值，不能播放返回一個(gè)假值

let a = new Audio();
if (a.canPlayType("audio/wav")) {
    a.src="./soundeffect.wav";
    a.play();   // 進(jìn)行播放
}

文檔 https://developer.mozilla.org...

控制播放

控制媒體播放使用的是play()和pause()方法用來控制和暫停媒體的播放

// 文檔載入完成后，開始播放背景音樂
window.addEventListener("load", () => {
    document.getElementById("music").play();
}, false);

通過設(shè)置urrentTime屬性進(jìn)行定點(diǎn)播放，
volume表示播放音量
playbackRate表示播放的速度
如果元素?fù)碛衏ontrols屬性，會(huì)在播放器上顯示控件，讓用戶進(jìn)行控制播放。
controls表示在瀏覽器中是否顯示控件true為顯示，false為隱藏，

查詢媒體狀態(tài)

他們有一些只讀的屬性，描述當(dāng)前的狀態(tài)。
播放器暫停，pause屬性值為true
播放器跳轉(zhuǎn)到一個(gè)新的播放點(diǎn)，seeking的值為true
如果完全播放完成，ended為true
duration媒體時(shí)長(zhǎng)
initialTime表示媒體的開始時(shí)間
等等還有很多，用的時(shí)候現(xiàn)查吧，過一遍，大致知道有這些屬性即可

媒體相關(guān)事件

會(huì)有媒體的相關(guān)事件，必須使用addEventListener()方法注冊(cè)在audio和video元素上，當(dāng)被請(qǐng)求的時(shí)候觸發(fā)，當(dāng)被加載的時(shí)候觸發(fā)等等。

下面是svg

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/98200.html

相關(guān)文章

  • 7月編程語言排行榜來了，為什么不同媒體報(bào)道的結(jié)果不一樣？

    摘要：排行榜編程語言排行榜是編程語言流行趨勢(shì)的一個(gè)指標(biāo)，每月更新，這份排行榜排名基于互聯(lián)網(wǎng)有經(jīng)驗(yàn)的程序員課程和第三方廠商的數(shù)量。官方地址總結(jié)由于這兩個(gè)榜單的依據(jù)不同，所以榜單結(jié)果出現(xiàn)不同是非常正常的現(xiàn)象。 在程序員的世界里一直流傳著這樣的一個(gè)笑話： 某女：你能讓這個(gè)論壇的人都吵起來，我今晚就跟你走。某軟件工程師：PHP是最好的語言！某論壇真的就炸鍋了，各種吵架……某女：服了你了，我們走吧，你...

    王笑朝 評(píng)論0 收藏0

  • JavaScript HTML5腳本編程——“媒體元素”的注意要點(diǎn)

    摘要：事件除了大量屬性之外，這兩個(gè)媒體元素還可以觸發(fā)很多事件。下表列出了媒體元素相關(guān)的事件。這兩個(gè)媒體元素都有一個(gè)方法，該方法接收一種格式編解碼器字符串，返回或空字符串。 audio和video元素的用法如下： 不支持音頻 不支持視頻 因?yàn)椴⒎撬袨g覽器都支持所有媒體格式，所以可以指定多個(gè)不同的媒體來源。為此，不用在標(biāo)簽中指定src屬性，而是要像下面這樣使用一或多個(gè)元素。 ...

    baoxl 評(píng)論0 收藏0

  • Python將被加入高考科目？你怎么看？

    摘要：浙江省教育廳基教處相關(guān)負(fù)責(zé)人也表示，目前為止，還沒有接到下半年開始使用新教材的通知。人生苦短，趕緊用起吧，大潮來襲，還在等什么原文鏈接將被加入高考科目你怎么看原文鏈接開發(fā)者交流平臺(tái)，沒有辦法放鏈接為了不侵權(quán)，把作者的公眾號(hào)聯(lián)系方式放在這里。 今天看到這樣的一則新聞：不禁感嘆，人工智能這股風(fēng)來的太快，已經(jīng)掀起全民學(xué)習(xí)Python的浪潮。 2017年中觀察：看上去這個(gè)大綱內(nèi)容基本是這樣了，...

    Yujiaao 評(píng)論0 收藏0

  • 沃土前端系列 - HTML常用標(biāo)簽

    摘要：由于網(wǎng)頁中不僅包含普通文本，還包含超文本，故被稱作超文本描述語言。是的縮寫，中文的意思是超文本標(biāo)記語言，它是制作網(wǎng)頁的標(biāo)準(zhǔn)語言。 html是什么 HTML是Hyper Text Markup Language的縮寫，中文的意思是超文本標(biāo)記語言，它是制作網(wǎng)頁的標(biāo)準(zhǔn)語言。由于網(wǎng)頁中不僅包含普通文本，還包含超文本，故被稱作超文本描述語言。那什么是超文本呢？所謂超文本，就是指圖像、視頻、動(dòng)畫、...

    lbool 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<