AMP

amp-dailymotion

實驗性
Bento

說明

顯示 Dailymotion 影片。

 

必要指令碼

<script async custom-element="amp-dailymotion" src="https://cdn.ampproject.org/v0/amp-dailymotion-0.1.js"></script>

用法

顯示 Dailymotion 影片。

使用回應式版面配置時,範例中的寬度和高度應能為 16:9 長寬比的影片產生正確的版面配置。

<amp-dailymotion
  data-videoid="x2m8jpp"
  layout="responsive"
  width="480"
  height="270"
></amp-dailymotion>

autoplay (自動播放)

如果存在此屬性,且瀏覽器支援自動播放

  • 影片會在自動播放開始前自動靜音
  • 當影片捲動到畫面外時,影片會暫停
  • 當影片捲動到畫面內時,影片會恢復播放
  • 當使用者輕觸影片時,影片會取消靜音
  • 如果使用者曾與影片互動 (例如,靜音/取消靜音、暫停/恢復等),且影片捲動到畫面內或外,影片的狀態會維持使用者離開時的狀態。例如,如果使用者暫停影片,然後將影片捲動到畫面外再返回影片,影片仍會處於暫停狀態。

data-videoid

Dailymotion 影片 ID 位於每個影片頁面網址中。例如,"x2m8jpp"https://www.dailymotion.com/video/x2m8jpp_dailymotion-spirit-movie_creation 的影片 ID。

data-mute (選填)

指示是否將影片靜音。

  • 值:"true""false"
  • 預設值:"false"

data-endscreen-enable (選填)

指示是否啟用結束畫面。

  • 值:"true""false"
  • 預設值:"true"

data-sharing-enable (選填)

指示是否顯示分享按鈕。

  • 值:"true""false"
  • 預設值:"true"

data-start (選填)

指定影片應從哪個時間點 (以秒為單位) 開始播放。

  • 值:整數 (秒數)。例如,data-start=45
  • 預設值:0

data-ui-highlight (選填)

變更控制項中使用的預設醒目提示顏色。

  • 值:十六進位顏色值 (不含前導 # 號)。例如,data-ui-highlight="e540ff"

data-ui-logo (選填)

指示是否顯示 Dailymotion 標誌。

  • 值:"true""false"
  • 預設值:"true"

data-info (選填)

指示是否在開始畫面顯示影片資訊 (標題和擁有者)。

  • 值:"true""false"
  • 預設值:"true"

data-param-* (選填)

所有 data-param-* 屬性都會新增為內嵌 Dailymotion iframe 的 src 值的查詢參數。您可以使用此屬性傳遞未明確宣告的自訂值。

索引鍵和值將會進行 URI 編碼。

  • data-param-origin="example.com"

請參閱 Dailymotion 的影片播放器文件,以深入瞭解參數和選項。

dock (停駐)

需要 amp-video-docking 擴充功能。 如果存在此屬性且影片為手動播放,當使用者將影片元件捲動到可視區域外時,影片會「最小化」並固定在角落或元素上。

如需更多詳細資訊,請參閱 關於停駐擴充功能本身的說明文件

通用屬性

此元素包含擴充至 AMP 元件的通用屬性

動作

play (播放)

播放影片。

pause (暫停)

暫停影片。

mute (靜音)

將影片靜音。

unmute (取消靜音)

取消影片靜音。

fullscreenenter (進入全螢幕)

將影片設為全螢幕。

驗證

請參閱 AMP 驗證工具規格中的 amp-dailymotion 規則

需要更多協助嗎?

您已閱讀此文件數十次,但它實際上並未涵蓋您的所有問題嗎?或許其他人也有相同感受:請在 Stack Overflow 上與他們交流。

前往 Stack Overflow
發現錯誤或缺少功能嗎?

AMP 專案非常鼓勵您的參與和貢獻!我們希望您能成為我們開放原始碼社群的長期參與者,但我們也歡迎您針對您特別關注的問題提供一次性的貢獻。

前往 GitHub