首頁 >web前端 >css教學 >如何在 iOS 上複製「後台附件:固定」行為?

如何在 iOS 上複製「後台附件:固定」行為?

Susan Sarandon
Susan Sarandon原創
2024-12-25 15:53:14968瀏覽

How to Replicate `background-attachment: fixed` Behavior on iOS?

複製後台附件:修正了iOS 上的行為

探索問題

使用後台附件時:為在iOS 上實現固定背景圖像時,開發人員會遇到尺寸意外調整和缺乏滾動效果的問題。此問題的出現​​是由於 iOS 上的 Safari 禁用背景附件以增強滾動效能。

了解瀏覽器限制

根據 @PaulIrish,固定背景會帶來重大的重繪成本,對滾動性能產生負面影響。因此,iOS 上的 Safari 已停用此行為。

替代方法

由於 iOS 不支援後台附件:固定,可以探索替代解決方案:

  • 固定位置DIV:

    • 建立位置:固定; DIV 並將背景影像放置在其中。
    • 使用position:relative; 剪輯DIV;
    • 此技術提供了一種解決方法,透過模擬固定背景行為而不使用後台附件:fixed。

範例

進一步實作請參考以下文章指導:

  • [用 777修復背景圖片](https://stackoverflow.com/questions/21128043/fixed-background-image-with-ios7)
  • [修復主體背景隨頁面滾動iO S7](https://stackoverflow.com/questions/20786807/fixed-body-background-scrolls-with-the-page-on-ios7)

以上是如何在 iOS 上複製「後台附件:固定」行為?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn