رفتن به مطلب

مشکل در sticky المان


پست های پیشنهاد شده

سلام.

من برای سایت یه هدر دارم که ارتفاع هدر تغییر میکنه. یعنی با اسکرول کردن ارتفاعش تغییر می کنه.حالا کوچکتر با بزرگتر.

حالا می خوام وقتی سایت رو اسکرول می کنم و هدر میاد پایین، به هدر بچسبه

من از پلاگین های sticky استفاده کردم. اما باید بهش یه padding-top بدیم و از اونجایی که هدر در صفحات مختلف دارای ارتفاع مختلف هست، نمیشه یه padding ثابت داد و بین سایدبار و هدر فاصله میافته.

ممنون میشم کمک کنید

یعنی یه جورایی این padding-top دینامیک محاسبه بشه.بر اساس ارتفاع هدر

لینک به ارسال

من درست متوجه منظورتون نشدم ولی اگر یه سربرگ چسبنده می خواید به کلاس یا ایدی سربرگتون position:fixed رو اضافه کنید و همچنین top:0 بازم اگه مشکلتون حل نشده بیشتر توضیح بدید

لینک به ارسال

فکر کنم اینطوری بگم بهتره.

میخوام وقتی اسکرول به پایین می کنم، وقتی هدر به سایدبار رسید، سایدبار هم stick بشه. وقتی هم اسکرول به بالا می کنم، سایدبار به نقطه اولش که برگشت، از حالت stick رها بشه.

یعنی برای سایدبار نقطه تعریف کنیم یه جورایی که هنگام اسکرول به پایین مثلا اگر فلان آی دی یا کلاس، بهش نزدیک شد یا فاصلش مثلا صفر شد، سایدبار stick بشه ( به هدر بچسبه مثلا ) و برعکس، هنگام اسکرول به بالا، وقتی سایدبار به بالا ترین نقطه خودش که حالت اولیه هست رسید از حالت stick رها بشه

لینک به ارسال

اینکار با جاوا شدنیه متاسفانه الان با گوشی هستم که تایپ کنم براتون  شما همون خاصیت fixed رو برای سربرگ انجام بدید و برای sidebar هم یک کد جاوا تعریف کنید که وقتی مثال اسکرول کردن به 100pxرسید یک کلاس به کلاس sidebar اضافه شه و وقتی اسکرول کمتر از 100px بود کلاس حذف بشه ، توی گوگل سرچ کنید موجود هست،برای اون کلاس جدیدتون هم خاصیت fixed و top رو مثال 80px و right:0 ، 

 

این یه نمونشه

ویرایش شده توسط asadiy4n
لینک به ارسال
  • 1 ماه بعد...
در در ۱۳۹۹/۳/۳ در 19:30، Clashbaz گفته است :

فکر کنم اینطوری بگم بهتره.

میخوام وقتی اسکرول به پایین می کنم، وقتی هدر به سایدبار رسید، سایدبار هم stick بشه. وقتی هم اسکرول به بالا می کنم، سایدبار به نقطه اولش که برگشت، از حالت stick رها بشه.

یعنی برای سایدبار نقطه تعریف کنیم یه جورایی که هنگام اسکرول به پایین مثلا اگر فلان آی دی یا کلاس، بهش نزدیک شد یا فاصلش مثلا صفر شد، سایدبار stick بشه ( به هدر بچسبه مثلا ) و برعکس، هنگام اسکرول به بالا، وقتی سایدبار به بالا ترین نقطه خودش که حالت اولیه هست رسید از حالت stick رها بشه

من بدون افزونه بهتون میگم که انجام بدید بهتره هم سایتتون الکی با افزونه سنگین نمیشه هم یخورده بیشتر نیست کداش راحت میتونید یاد بگیرید و استفاده کنید.

اول از همه خاصیت هدرتونو absolute کنید و بادی رو relative کنید که بتونید از بالا بهش فاصله بدید اندازشو اونجور که میخواید درست کنید.
بعد از اونجایی که میخواید اسکرول میاد پایین تر باید به پیکسل تعیین کنید که از اون لحظه هدرتون تاپش 0پیکسل بشه و بعد از اون هم باشد تعیین کنید که وقتی به اون نقطه رسید و برگشت باشد پوزیشت هدر همون قبلی بشه

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...