Chrome 126 新功能

以下是一些注意事項:

我是 Adriana Jara一起來深入探索 Chrome 126 為開發人員推出的新功能。

相同來源瀏覽的跨文件檢視轉換

View Transitions API 可讓您在不同檢視畫面之間建立流暢的視覺轉場效果,現在可用於相同來源的導覽功能。以前,此 API 僅適用於單一頁面應用程式架構。

如要執行跨文件檢視轉換,兩個步驟都必須選擇接受。方法是使用規則中的檢視畫面轉換,並將導覽描述元設為「auto」。

跨文件檢視轉場效果使用的構成元素和原則與相同文件檢視轉換相同。

@view-transition {
  navigation: auto;
}

詳情請參閱「使用 View Transition API 順利進行轉換」一文,瞭解更多範例。

已重新啟用 CloseWatcher API

對於 <dialog>popover="" 元素,CloseWatcher API 可以更輕鬆地處理關閉要求。 例如電腦平台的 ESC 鍵,Android 上的返回手勢

這項功能最初是在 Chrome 120 版中推出,但因與對話方塊元素非預期互動,所以已停用。並在 Chrome 126 中重新啟用這項功能,盡可能減少先前的問題。

若要瞭解如何使用 CloseWatcher,請參閱示範影片

Gamepad API trigger-rumble 擴充功能

觸發器功能現在是 Gamepad API 的一部分。透過相容的控制器提升網路遊戲體驗。

trigger-rumble 會擴充 GamepadHapticActuator,此介面代表控制器中的硬體,旨在為使用者提供觸覺回饋 (如果有的話)。trigger-rumble 允許使用 Gamepad API 的網頁應用程式同時震動這些遊戲手把裝置的觸發事件。

您可以利用下列程式碼檢查瀏覽器是否支援這項功能,以及如何觸發 —trigger-rumble

// This assumes a `Gamepad` as the value of the `gamepad` variable.
const triggerRumble = (gamepad, delay = 0, duration = 100, weak = 1.0, strong = 1.0) => {
  if (!('vibrationActuator' in gamepad)) {
    return;
  }
  // Feature detection.
  if (!('effects' in gamepad.vibrationActuator) || !gamepad.vibrationActuator.effects.includes('trigger-rumble')) {
    return;
  }
  gamepad.vibrationActuator.playEffect('trigger-rumble', {
    // Duration in ms.
    duration: duration,
    // The left trigger (between 0 and 1).
    leftTrigger: leftTrigger,
    // The right trigger (between 0 and 1).
    rightTrigger: rightTrigger,
  });
};

如要進一步瞭解如何充分運用 Gamepad API,請參閱「使用遊戲手把玩 Chrome 恐龍遊戲」。

還有更多獎品等著您!

當然,還有許多其他功能

閱讀完整版本資訊

延伸閱讀

這只涵蓋部分重要亮點。請參閱下列連結: Chrome 126 的其他變更。

訂閱

歡迎訂閱 Chrome Developers YouTube 頻道, 每次推出新影片時,您都會收到電子郵件通知。

Yo soy Adriana Jara 等 Chrome 127 推出後,立即向各位說明 Chrome 的新功能!