shipshapecode/tether
کاربرد:
این ابزار به تو کمک می‌کنه تا المان‌هایی مثل tooltip، dropdown و overlay رو به‌صورت هوشمندانه و بدون خروج از صفحه، در جای مناسب نمایش بدی. با استفاده از Tether، موقعیت‌یابی این المان‌ها به‌صورت پویا و با توجه به فضای موجود انجام می‌شه.
در چه شرایطی بهتره استفاده شود؟
وقتی توی طراحی رابط کاربری هستی و نیاز داری یه المان رو کنار یه دکمه یا متن نشون بدی، اما مطمئن نیستی که کاربر از چه دستگاهی داره صفحه رو باز می‌کنه. اینجا Tether بهت کمک می‌کنه که المان همیشه در جای درستی ظاهر شود، حتی اگر صفحه اسکرول شده باشه یا اندازه پنجره تغییر کرده باشه.
چند مثال از موارد استفاده
نمایش توضیحات کوتاه (tooltip) روی هاور کردن یک آیکون
باز شدن منوی کشویی (dropdown) بدون اینکه از مرز صفحه بیرون بره
نمایش پنجره‌های مودال یا هشدار (overlay) در کنار المان مورد نظر
قرار دادن راهنماهای تعاملی در آموزش کاربر از طریق tour های رابط
- ##UI
- ##Tooltip
- ##Dropdown
- ##Overlay
- ##Positioning
- ##JavaScript
- ##Web
- ##Frontend
- ##Tether
- ##Responsive