Kaydırmalı Hikaye Hero

Bu bölüm ne yapar

Kaydırma odaklı hikaye anlatımı hero'su — her öğe tam bir ekran kaydırma alanına sahip

Nereye konulur

• Bir sayfada en fazla 1 kez kullanılabilir.
• Bu bölüm her pakette vardır, ayrıca eklenti gerekmez.

Stiller

Aynı bölümün farklı görünümleri. Stili sonradan da değiştirebilirsiniz; içeriğiniz olduğu gibi kalır.

Her bölümün ilk 2 stili her mağazada açıktır. Sonrakiler Sayfa Düzenleyici eklentisiyle açılır — stil stil değil, hepsi birden.

• Sinematik

  Ücretsizcinematic

  Yavaş Ken Burns yakınlaşmasıyla tam ekran çapraz geçişli görseller, dev ortalanmış tipografi ve dikey ilerleme çubuğu. Her bölüm tam bir ekran kaydırma alanına sahip

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• Bölünmüş Parallax

  Ücretsizsplit-parallax

  Devasa bir medya paneli yanında metin sütunu. Kaydırdıkça medya paralaks kayar, metin çeviri ve solma ile değişir

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• İstiflenmiş Kartlar

  Sayfa Düzenleyicistacked-cards

  Her yeni bölümün dev yuvarlatılmış medya kartı bir öncekinin üzerine kayarak yerleşir — dokunsal, deste tarzı bir açılış

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• Kinetik Bölünme

  Sayfa Düzenleyicikinetic-split

  Kaydırmayla koreografi: metin soldan, görsel sağdan girer, kesişir ve yerine oturur, sonra zıt yönlere uçarken sonraki bölüm girer. Yumuşak, hafif döndürmeli

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• Yay Açılışı

  Sayfa Düzenleyiciarc-reveal

  İçerik düz çizgi yerine eğri (çeyrek daire) yollarda hareket eder — görsel yandan dönerek girer, metin kendi yayında yükselir

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• Sayfa Çevirme

  Sayfa Düzenleyiciflip-through

  Her bölüm, sayfa çevirir gibi dönen tam ekran bir karttır — kenardan girer, düzleşip size bakar, sonra arkasından yeni sayfa gelirken çevrilir. Gerçek 3B

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• Editoryal Takas

  Sayfa Düzenleyicieditorial-swap

  Tam ekran değil: yanda kalın büyük metin, karşısında çerçeveli görsel. Kaydırınca metin sol kenardan çıkar, görsel metnin yerine kayıp sonraki bölüme geçiş yapar; sonraki metin sağ kenardan girer. Yumuşak yay hareketleri

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• Yörünge İkilisi

  Sayfa Düzenleyiciorbit-duo

  Kalın büyük metin ve çerçeveli görsel, merkez etrafında dairesel bir yörüngede döner ve kaydırdıkça yer değiştirir. Tamamen dairesel hareket — düz kaydırma değil

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• Poster Takası

  Sayfa Düzenleyiciposter-swap

  Görsel odaklı: sahnenin yarısından fazlasını kaplayan büyük poster görsel, kenarına taşan dev kalın metin. Poster yay çizerek girer, metin ters yöne süzülüp sonraki bölüme geçiş yapar

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• İkili Çerçeve

  Sayfa Düzenleyiciduo-frames

  Her bölümde iki çerçeveli fotoğraf — büyük ana görsel ve daha küçük bir vurgu (sonraki bölümün fotoğrafı) — kalın büyük metnin yanında. Çerçeveler kademeli yaylarla süzülür, hep birden çok görsel sahnede

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

• Film Şeridi

  Sayfa Düzenleyicifilmstrip

  Yatay galeri: aynı anda üç bölüm — önceki ve sonraki görseller kenarlarda küçük ve soluk, mevcut görsel büyük ve ortada. Kaydırma şeridi yumuşak bir yay boyunca ilerletir; başlık yalnızca ortadayken belirir

  Bu stile özel: parallaxIntensity, overlayOpacity, showProgressRail, showScrollHint, scrollHintText, imageSide, items

Ayarlar

Bir bölümü seçtiğinizde sağdaki Bölüm Ayarları panelinde görebileceğiniz alanlar.

Tüm stillerde ortak

• bg
• contentMaxWidth
• sectionMaxWidth
• horizontalPadding
• verticalPadding
• verticalAlignment
• horizontalAlignment
• horizontalMargin
• verticalMargin
• spacingOverrides
• animationType
• animationDuration
• animationDelay
• animationEasing
• animationStagger
• animationRepeat
• animationParallax
• imageParallax
• animationScrollEffect
• height