將自定義過渡與 Animate.css 結合使用

在本主題中,您將學習如何使用 Animate.css 為註釋添加自定義過渡。

動畫.css 是一個隨時可用的跨瀏覽器動畫庫,可用於 Web 項目。Animate.css 被創造丹尼爾·伊登(@_dteGitHub 上)。Animate.css 可用於增強註釋在視頻播放期間的顯示方式。

按照以下步驟將過渡添加到註釋。

  1. 登入到布萊奇灣互動工作室 ( https://www.hapyak.com/login )。
  2. 在左側導覽中,按一下「管理」
  3. 單擊一個項目將其打開。
  4. 按一下設定
  5. 在自定義註釋 CSS(網
    址)字段中,添加以下網址:
  6. 按一下提交
  7. 若要將動畫加入至註釋,請按一下註釋的「編輯」(Edit)選單。
  8. 點擊更多...
  9. 按一下新增類別
  10. 在「類別」欄位中,輸 < 入動畫中的動畫名稱 >,例如動畫縮放左側
  11. 按一下提交

以下動畫名稱在 Brightcove Interactivity 中有效。

  • 彈跳
  • 脈衝
  • 搖晃
  • 橡皮筋
  • 搖擺
  • 多田
  • 翻動

  • 合頁

  • 反彈
  • 反彈
  • 彈跳向下
  • 向左反彈
  • 向右彈跳

  • 淡入大
  • 淡入淡出大
  • 淡入左大
  • 右淡入大
  • 右淡入

  • 翻轉輸入X
  • 翻轉Y

  • 光速輸入

  • 旋轉輸入
  • 左下旋轉
  • 向右旋轉
  • 向左旋轉
  • 向右旋轉

  • 滾入
  • 放大
  • 左放大
  • 右放大
  • 放大
  • 放大縮小