自助建站、網頁設計教程

通過學習路線圖,零基礎學習專業網頁設計、小程序UI設計技巧,成就網頁設計高手。

視頻組件

隨著流量時代的到來和硬件技術的提升,越來越多的網站希望能在PC端或移動端播放自己的視頻,因此coolsite360也集成了視頻組件給大家使用,讓你的站點得到更多個性化的提升。

視頻格式
目前,主流瀏覽器所支持的視頻格式有限,為mp4ogv格式,視頻編碼方式:H.264。否則視頻可能不會播放。

推薦視頻尺寸

1920*1080

主流的游覽器支持

Internet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持 <video> 標簽。

注釋:Internet Explorer 8 以及更早的版本不支持 <video> 標簽。

插入視頻組件

在左側工具欄中找到媒體下的視頻組件,單擊鼠標,這時視頻組件就會嵌入當前位置的網頁中。

全屏視頻

在右側css配置面板設置視頻的寬:100%,高:auto;

這樣就能實現全屏顯示,如下圖所示。

 

視頻設置

選中視頻,在右側配置面板找到視頻類型,這里支持使用視頻鏈接上傳視頻兩種方式。

上傳視頻

基礎版及以上用戶支持視頻上傳功能,單個上傳視頻大小限制在150M以下且必須為mp4格式。

視頻鏈接

此處只能貼服務器視頻地址,推薦使用上傳本地視頻。

功能講解

這里集成了視頻組件的所有屬性,每個屬性都有各自的用途。

1.預加載

勾選后進入網頁視頻優先加載。不勾選則不加載,節約流量。

2.自動播放

用于設置視頻是否自動播放,勾選時,表示自動播放,去掉是表示不自動播放。

3.控制欄

用于向瀏覽器指明頁面制作者沒有使用腳本生成播放控制器,需要瀏覽器啟用本身的播放控制欄。因此在每個游覽器等看到的控制欄有可能不盡相同。控制欄須包括播放暫停控制,播放進度控制,音量控制等等。

勾選則顯示控制欄。如下圖。

不勾選則不顯示。

4.循環播放

勾選后視頻循環播放,不勾選播放完成后自動停止。

5.靜音

勾選后視頻停止播放聲音,不勾選視頻播放聲音。

 

全屏動態視頻背景

很多動態炫酷全屏網頁可以用視頻組件實現,具體設置如下

1.上傳視頻尺寸為1920*1080p。

2.更改視頻組件寬:100%,高auto。

3.不勾選顯示控制欄。

4.勾選自動播放,循環播放。

 

 

提交成功,謝謝反饋!

請完整填寫表單的信息后,再進行提交!

vr赛车一套设备多少钱 全民欢乐捕鱼破解版 重庆时时过年放假吗 西游争霸四海归一预兆 麻将来了有几个版本 正宗四川成都麻将单机版 时时彩后一三码 时时彩稳赚技巧十年心得 网投稳赚 海南飞鱼查询 体彩稳赚不赔啊 今日山西快乐10分走势 三肖八码