#
  • داشبورد
  • داشبورد4
    • پروژه
    • فروشگاه
  • اپلیکیشن‌ها
    • تقویم
    • صفحه پروفایل
      • پروفایل
      • تنظیمات
    • صفحه پروژه‌ها
      • پروژه‌ها
      • جزئیات پروژه
    • لیست کارها
    • تیم
    • رابط برنامه‌نویسی (API)
    • تیکت‌ها
      • تیکت
      • جزئیات تیکت
    • ایمیل‌ها
      • ایمیل
      • خواندن ایمیل
    • فروشگاه
      • سبد خرید
      • محصولات
      • افزودن محصول
      • جزئیات محصول
      • لیست محصولات
      • سفارش‌ها
      • جزئیات سفارش
      • لیست سفارش‌ها
      • تسویه‌حساب
      • علاقه‌مندی‌ها
    • فاکتور
    • چت
    • مدیریت فایل
    • بوک‌مارک (Bookmark)
    • بورد کانبان (Kanban Board)
    • تایم‌لاین
    • سؤالات متداول
    • قیمت‌گذاری
    • گالری
    • بلاگ
      • لیست بلاگ
      • جزئیات بلاگ
      • افزودن بلاگ
  • ویجت‌ها
  • کیت رابط کاربری
  • کیت UI
    • هشدار
    • نشان‌ها
    • دکمه‌ها
    • کارت‌ها
    • منوی کشویی
    • شبکه
    • آواتار
    • تب‌ها
    • آکاردئون
    • نوار پیشرفت
    • اعلان‌ها
    • لیست‌ها
    • کلاس‌های کمکی
    • پس‌زمینه
    • جداکننده
    • روبان‌ها
    • ویرایشگر
    • جمع‌شونده
    • سایه
    • Wrapper
    • Bullet
    • Placeholder
    • تراز‌بندی
  • رابط کاربری پیشرفته12+
    • مدال‌ها
    • پنل offcanvas
    • سوییت آلرت (Sweet Alert)
    • اسکرول بار (Scroll bar)
    • اسپینر (Spinner)
    • انیمیشن
    • ویدیو Embed
    • تور راهنما
    • اسلایدر
    • اسلایدر بوت‌استرپ
    • Scrollpy
    • تولتیپ و پاپ‌اور (Tooltip & Popovers)
    • امتیازدهی (Rating)
    • Prismjs
    • شمارش معکوس
    • شمارش بالا
    • قابل‌کشیدن (Draggable)
    • نمای درختی (Tree view)
  • آیکون‌ها
    • Fontawesome
    • پرچم‌ها
    • Tabler
    • آب‌وهوا
    • انیمیشنی
    • Iconoir
    • Phosphor
  • متفرقه
  • نقشه و نمودارها
  • نقشه‌ها
    • نقشه گوگل
    • نقشه Leaflet
  • نمودارها
    • Chart.js
    • Apexcharts
      • Line
      • Area
      • Column
      • Bar
      • Mixed
      • Timeline & Range Bars
      • Candlestick
      • Boxplot
      • Bubble
      • Scatter
      • Heatmap
      • Treemap
      • Pie
      • Radial Bar
      • Radar
  • جدول و فرم‌ها
  • جدول‌ها
    • جدول پایه
    • جدول داده
    • لیست JS
    • جدول پیشرفته
  • عناصر فرم
    • اعتبارسنجی فرم (validation)
    • اینپوت basic
    • چک‌باکس و رادیو
    • اینپوت گروهی (input-groups)
    • ماسک ورودی (input-mask)
    • برچسب شناور (floating-labels)
    • دیت پیکر (datepicker)
    • touch-spin
    • پکیج Select2
    • سوییچ (switch)
    • رنج اسلایدر (range-slider)
    • تکمیل خودکار (Typeahead)
    • textarea
    • کلیپ‌بورد (clipboard)
    • آپلود فایل
    • لیست دوگانه
    • فرم پیش‌فرض
  • قابل استفاده آمادهجدید
    • فرم چندمرحله‌ای
    • فرم چندمرحله‌ای ۱
    • فرم چندمرحله‌ای ۲
    • فرم آماده
    • جدول آماده
  • صفحات
  • صفحات احراز هویت
    • ورود
    • ورود با تصویر زمینه
    • ثبت‌نام
    • ثبت‌نام با تصویر زمینه
    • بازیابی رمز
    • ایجاد رمز
    • قفل صفحه
    • تأیید دو مرحله‌ای
  • صفحات خطا
    • درخواست نامعتبر
    • دسترسی ممنوع
    • یافت نشد
    • خطای سرور
    • سرویس در دسترس نیست
  • سایر صفحات
    • خالی
    • نگهداری
    • صفحه لندینگ
    • به‌زودی
    • نقشه سایت
    • سیاست حفظ حریم خصوصی
    • شرایط و قوانین
  • سایر موارد
  • منوی دو سطحی
    • خالی
    • سطح دیگر
      • خالی
  • مستندات
  • پشتیبانی
  • 26 °C
  • EN
  • 5
  • avatar
  • تمامی حقوق محفوظ است @فاطمه کاظمی زاده -

  • نسخه 1.0.0
  • Need Help

پیمایش خودکار (Scrollpy)

  • رابط کاربری پیشرفته
  • پیمایش خودکار (Scrollpy)
اسکرول‌اسپای در نوار ناوبری
#

پاراگراف اول

یک متن آزمایشی برای بخش اول. این متن نشان می‌دهد که اسکرول‌اسپای چگونه کار می‌کند و محتوای مرتبط را هایلایت می‌کند.

پاراگراف دوم

محتوای بخش دوم. این قسمت شامل توضیحات بیشتر برای تست عملکرد اسکرول و ارتباط آن با ناوبری است.

پاراگراف سوم

در اینجا بخش سوم نمایش داده می‌شود که به کاربر امکان می‌دهد موقعیت خود را در متن دنبال کند.

پاراگراف چهارم

بخش چهارم برای نمایش ادامه متن طراحی شده است تا نمونه‌ای واقعی‌تر از اسکرول‌اسپای ارائه دهد.

پاراگراف پنجم

این متن بخش پنجم است و به عنوان آخرین بخش نمونه برای آزمایش اسکرول‌اسپای استفاده می‌شود.

اسکرول‌اسپای با منوی تو در تو
آیتم ۱

یک طراح وب حرفه‌ای فردی است که در ایجاد وب‌سایت‌های زیبا و کاربردی تخصص دارد. او اصول طراحی، تجربه کاربری و زبان‌های برنامه‌نویسی را به‌خوبی می‌شناسد تا وب‌سایتی هم زیبا و هم کاربرپسند بسازد.

آیتم ۱.۱

نقش یک طراح وب فراتر از ظاهر زیباست. او باید اصول طراحی تجربه کاربری (UX) را بداند، اطمینان حاصل کند که سایت به‌راحتی قابل استفاده است و روی دستگاه‌ها و اندازه‌های مختلف به‌خوبی نمایش داده می‌شود.

آیتم ۱.۲

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

آیتم ۲

علاوه بر مهارت‌های طراحی، یک طراح وب باید زبان‌های کدنویسی مانند HTML، CSS و JavaScript را بلد باشد تا طرح‌ها را پیاده‌سازی کند و سایت به‌درستی کار کند.

آیتم ۳

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

آیتم ۳.۱

او باید بداند که کاربران چگونه با وب‌سایت تعامل می‌کنند، ناوبری آسان و چیدمان منطقی را تضمین کند و طراحی واکنش‌گرا (Responsive) را رعایت کند.

آیتم ۳.۲

طراح وب علاوه بر طراحی، باید دانش کدنویسی نیز داشته باشد تا طرح‌ها را پیاده‌سازی کند و تعاملات مورد نیاز را اضافه کند. او اغلب با توسعه‌دهندگان همکاری می‌کند تا طرح‌ها به‌درستی اجرا شوند.

اسکرول‌اسپای با لیست گروهی
آیتم ۱آیتم ۲آیتم ۳آیتم ۴
آیتم ۱

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

آیتم ۲

طراح وب مانند یک داوینچی مدرن است که با پالت پیکسل‌ها و بوم کدنویسی کار می‌کند. او مفاهیم انتزاعی را به واقعیت‌های آنلاین تبدیل می‌کند و همواره جلوتر از ترندها و فناوری‌های روز حرکت می‌کند.

آیتم ۳

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

آیتم ۴

طراحان وب ترکیبی از خلاقیت و تخصص فنی دارند. آن‌ها با درک عمیق از تجربه کاربری و توجه به جزئیات، وبسایت‌هایی می‌سازند که هم کارایی دارند و هم تأثیرگذارند. نتیجه کار آن‌ها تجربه‌ای است که هم زیبایی‌شناسی و هم کارایی را تضمین می‌کند.

لینک‌های ساده
آیتم ۱آیتم ۲آیتم ۳آیتم ۴آیتم ۵
آیتم ۱

آیا به دنبال یک متخصص خلاق هستید که بتواند وبسایت شما را زنده کند؟ یک طراح وب با تخصص در طراحی و فناوری، می‌تواند وبسایتی زیبا و کاربرپسند ایجاد کند که مخاطبان شما را جذب نماید. او اهمیت طراحی خوب در دنیای دیجیتال امروز را می‌داند و طراحی را متناسب با هویت برند و مخاطب هدف شما سفارشی‌سازی می‌کند.

آیتم ۲

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

آیتم ۳

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

آیتم ۴

علاوه بر مهارت‌های فنی، طراحان وب حل‌کننده‌های عالی مشکلات هستند. آن‌ها اهداف کسب‌وکار شما را تحلیل کرده و آن را به یک وبسایت مؤثر ترجمه می‌کنند. آن‌ها همیشه با جدیدترین روندها و فناوری‌ها به‌روز هستند تا وبسایت شما مدرن و رقابتی باقی بماند.

آیتم ۵

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