Viewport Segments API ile katlanabilir cihazları destekleme

Alexis Menard
Alexis Menard

Yayınlanma tarihi: 9 Haziran 2025

Görüntü alanı segmentleri API'si, görüntü alanının mantıksal olarak ayrı bir bölgesinin konumuna ve boyutlarına JavaScript veya CSS ile erişim sunar ve Chrome 138'den itibaren kullanılabilir.

Browser Support

  • Chrome: 138.
  • Edge: 138.
  • Firefox: not supported.
  • Safari: not supported.

Görüntü alanı, bir veya daha fazla donanım özelliği (ör. ayrı ekranlar arasındaki katlama veya menteşe) ile bölündüğünde görüntü alanı segmentleri oluşturulur. Bu özellikler, ayırıcı görevi görür.

Segmentler, sitenizi veya uygulamanızı geliştirirken mantıksal olarak farklı şekilde ele alabileceğiniz görüntü alanı bölgeleridir. Bu heyecan verici API'ler, arayüzünüzü özellikle katlanabilir cihazlar için oluşturmanıza veya optimize etmenize olanak tanır. Örneğin, çift bölmeli bir kullanıcı deneyimi oluşturabilir veya yalnızca içeriğin katlanma çizgisinin altında kalmasını önleyebilirsiniz.

Geçen yıl gerçekleştirdiğimiz deneme sürecinden sonra iki değişiklik yapıldı:

  • segments JavaScript özelliği artık window.visualViewport yerine yeni eklenen window.viewport nesnesinde bulunuyor.
  • Cihaz katlanmadığında segments özelliği davranışı, bu özelliğin CSS davranışı ile aynı olacak şekilde ayarlandı. Bir cihaz katlanmadığında (veya katlanamadığında) segments özelliği, görünüm alanı boyutunun tamamını temsil eden tek bir segment dizisi içerir.

API'nin nasıl çalıştığını görmek için katlanabilir cihaz demolarını inceleyin.

Katlanabilir cihazda, menteşe boyunca iki mantıksal segmente bölünmüş bir web sayfası gösteriliyor.