چگونه ایجاد شود: عناصر چسبنده

عناصر چسبنده

مثال

div.sticky {
  position: -webkit-sticky; /* سافاری */
  position: sticky;
  top: 0;
}

شما خودتان امتحان کنید

عناصر که از position: sticky; استفاده می‌کنند، بر اساس موقعیت اسکرول کاربر قرار می‌گیرند.

عناصر چسبنده بین قرارگیری نسبی و ثابت تغییر می‌کنند، بسته به موقعیت اسکرول. قبل از اینکه در داخل视‌فیلد به موقعیت جابجایی داده شده برسد، قرارگیری نسبی دارد و سپس در همان مکان باقی می‌ماند (مثل position:fixed).

توجه داشته باشید:اینترنت اکسپلورر، نسخه 15 و قبل از آن از قرارگیری چسبنده پشتیبانی نمی‌کند. سافاری نیاز به پیشوند -webkit- دارد (مثال زیر را ببینید). برای اینکه قرارگیری چسبنده کار کند، حداقل باید یکی از top، right، bottom یا left را مشخص کنید.

صفحات مرتبط

آموزش‌ها:چيدمان CSS - ويژگي position