FanGallery

<r-fan-gallery>APIتوکن‌های سبکزمین بازیکد منبع

فرزندانش را مثل دستی ورق بادبزنی باز می‌کند. هر فرزند حول نقطه‌ای زیر ردیف می‌چرخد، برای همین گروه مثل یک شیء واحد دیده می‌شود، نه یک نوار.

وقتی استفاده کنید که چند جلد، اسکرین‌شات یا کارت باید یک مجموعه دیده شوند و نشان دادن اینکه چندتا هستند مهم‌تر از نشان دادن کامل هرکدام است. برای محتوایی که خواننده باید کنار هم مقایسه کند، از شبکه (grid) استفاده کنید.

شروع سریع

استفادهٔ پایه

<r-fan-gallery>
  <a href="/one">1</a>
  <a href="/two">2</a>
  <a href="/three">3</a>
  <a href="/four">4</a>
</r-fan-gallery>

فرزندان عناصر خود شما هستند. پیوندها، دکمه‌ها و تصاویر نقش، نام و جایگاهشان در ترتیب Tab را حفظ می‌کنند؛ گالری فقط آن‌ها را جابه‌جا می‌کند.

گستردگی

spread زاویه بر حسب درجه بین نخستین و آخرین فرزند است. با 0 همه روی هم قرار می‌گیرند.

<r-fan-gallery spread="48">…</r-fan-gallery>

حرکت

• باز شدن. تا وقتی گالری نخستین بار به دید نیامده، فرزندانش روی هم چیده شده‌اند، پس فرزند جلویی از همان ابتدا خواناست. وقتی به دید می‌آید، بادبزن با حرکتی فنری یکی پس از دیگری باز می‌شود. در هر صفحه فقط یک بار باز می‌شود؛ دور شدن و برگشتن با اسکرول آن را تکرار نمی‌کند.
• اشاره‌گر و فوکوس. فرزندِ زیر اشاره‌گر یا دارای فوکوس بالا می‌آید و به جلو می‌رود و همسایه‌هایش کمی کنار می‌چرخند. واکنش فوری است و هر حرکت تازه از همان جایی ادامه می‌یابد که حرکت قبلی رسیده بود.
• کاهش حرکت. با prefers-reduced-motion: reduce بادبزن از ابتدا باز است و هر تغییر بدون گذار اعمال می‌شود.

مرجع API

خصیصه‌ها

Part‌ها

استایل

ارتفاع گالری برابر بلندترین فرزند آن است. گوشه‌های چرخیده از stage بیرون می‌زنند، پس دور آن فضا بگذارید یا --ran-fan-gallery-padding را بیشتر کنید.

زمین بازی