آموزش کامپوننت های Progress-bar و Scrollspy در بوت استرپ 4


آموزش کامپوننت های Progress-bar و Scrollspy در بوت استرپ 4
براي خريد اين درس نياز است وارد سايت شويد. در صورت نداشتن حساب کاربري عضو شويد.

یادگیری کامپوننت های Progress-bar و Scrollspy در بوت استرپ 4:


در این بخش از آموزش، با کامپوننت‌های Progress-bar و  Scrollspy و کلاس‌های آن‌ها در bootstrap 4 آشنا می شوید. زمانی که بخواهیم میزان پیشرفت یک فرآیند و یا درصد اعتبار و ارزش یک چیز را نشان دهیم، از کامپوننت Progress-bar استفاده می کنیم.
از کامپوننت Scrollspy برای پیمایش صفحه استفاده می شود و با کلیک روی لینک‌ها به محتوای مربوط به آن لینک پرش می کند.

کلاس‌های Progress-bar:

  • progress: برای ایجاد یک نوار پیشرفت از این کلاس استفاده میشود.
  • progress-bar: از این کلاس برای ایجاد عناصر فرزند progress استفاده میشود.
  • width: برای تنظیم عرض نوار پیمایش استفاده میشود.
  • height: برای تنظیم ارتفاع نوار پیمایش استفاده میشود.
  • progress-bar-striped: با استفاده از این کلاس میتوان نوار پیشرفت را به صورت راه راه نمایش داد.
  • progress-bar-animated: برای ایجاد انیمیشن در نوار پیشرفت استفاده میشود. برای مثال، با این کلاس می توان حالت راه راه نوار را به صورت متحرک نمایش داد.


کلاس‌های Scrollspy:

  • data-spy = “scroll”: این صفت باید به عنصری که به عنوان محدوده قابل پیمایش استفاده می شود، اضافه شود. (معمولا به body اضافه می شود.)
  • data-target: این ویژگی برای اتصال نوار پیمایش با محدوده قابل پیمایش استفاده می شود. باید نام آیدی یا کلاس نوار پیمایش (.navbar) را به این ویژگی اضافه کنیم.
  • Scrollspy Vertical Menu: می توانیم از .nav- pills برای ایجاد scrollspy عمودی، استفاده کنیم.

 

برای یادگیری این مبحث مثال‌ها و نکته‌های متعددی را در فایل ویدئویی آورده‌ایم که با تهیه این درس و مشاهده ویدئوها به طور کامل به این مبحث مسلط خواهید شد.

 

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

انجمن برنامه نویسان وب

 


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


مشخصات دوره


مدرس دوره : مهدی عباسی
تعداد جلسات : جلسه
مدت زمان : 661 دقیقه
حجم دوره : 2/78 گیگابایت
سطح مهارت : مقدماتی تا پیشرفته
وضعیت دوره : پایان یافته
تعداد دانشجویان : 1268
: میانگین امتیاز
برای دسترسی به این دوره وارد یا عضو شوید.
مهدی عباسی

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