دوره مجازی جاوااسکریپت (جلسه 32): پروژه های اسلایدر، منوی کناری مخفی و محتوای تب دار

- visibility ١٢ mode_comment

امروز  جلسه پرباری رو خواهیم داشت و در این جلسه 3 پروژه جالب و بسیار کاربردی رو با هم پیاده سازی خواهیم کرد. مدت زمان این جلسه کمی طولانی شده و دلیلش هم زمان بر بودن پیاده سازی این موارد هست. در ابتدا به بررسی و توضیح دو پروژه محتوای تب دار (tabbed content) و منوی کناری مخفی خواهیم پرداخت و بعد از اون به طراحی و کدنویسی پروژه اسلایدر معروفمون می پردازیم. دموی اسلایدر طراحی شده و آموزش داده شده در این جلسه رو از لینک زیر می تونید ببینید :

مشاهده دموی پروژه اسلایدر این جلسه

مطالب مطرح شده در این جلسه عبارتند از :

  • توضیح در مورد تمرین-پروژه جلسه قبل
  • پروژه محتوای تب دار - tabbed content
  • توضیح ساختار باکس های تب دار (tabbed content)
  • توضیح کدهای html و css باکس های tabbed
  • کدهای جی کوئری محتوای تب دار
  • پروژه منوی کناری مخفی
  • توضیح کدهای پروژه منوی کناری مخفی
  • پروژه اسلایدر تصویر با امکانات ویژه
  • تعریف پروژه اسلایدر و نمایش دموی آن
  • تشریح قابلیت اسلایدر طراحی شده در این جلسه
  • توضیح کدها و ساختار html و css اسلایدر
  • تشریح قابلیت های اسلایدر و option های موجود
  • ایجاد بخش شمارنده (شماره اسلاید) برای پروژه
  • ایجاد دکمه های رفتن به اسلاید بعدی و قبلی برای پروژه
  • ایجاد دکمه های کنترلی اسلایدها برای پروژه
  • ایجاد caption و توضیح مخصوص برای هر اسلاید
  • تعین انیمیشن های ورورد و خروج هر اسلاید
  • نحوه تنظیم سرعت اجرای انیمیشن
  • نحوه تنظیم و کدنویسی برای تعین مدت زمان نمایش هر اسلاید
  • آموزش نحوه کدنویسی برای توقف اسلایدر در هنگام بردن نشانگر موس روی آن
  • آموزش نحوه پشتیبانی اسلایدر از گسچرهای لمسی برای گوشی های هوشمند و تبلت ها
  • آموزش نحوه تنظیم نوع نمایش اسلایدها (پشت سرهم یا رندم)
  • بررسی نکات مهم و ویژه پروژه این جلسه
info توجه

این مطلب یک جلسه از دورهدوره آموزش جامع و پروژه محور جاوااسکریپت و جی کوئری (پایه تا پیشرفته) می باشد و برای مشاهده آن باید در دوره ثبت نام کنید.

ثبت نام در دوره دوره جاوااسکریپت و جی کوئری

comment دیدگاه کاربران
رشاد قشمی

استاد این دوره فریمورک PHP رو کی شروع میکنین؟

لقمان آوند

اوایل مهرماه سعی می کنیم.

Թ • Ր • Տ  lօгժ

سلام آموزش نود جی اس جاوا اسکریپت سمت سرورو ندارین؟؟؟ کی امکانش فراهم میشه

سلام معلوم نیست,فعلا برنامه ای برای این مورد نداریم

Ahad Ghaderi

سلام.لطفا لینک دانلود تمرینات همه قسمت ها رو در یک فایل برای دانلود قرار بدید

لقمان آوند

سلام
فعلا مقدور نیست. در همه جلسات این لینک جداگانه وجود داره

حامد اعتضادی

سلام من کد زیر رو نمی فهمم تو قسمت دوم جایگزینی، محبت می کنین توضیح بدین، این کد برای اینه که نشون بده یه حرف چند بار تو یه استرینگ تکرار شده

کیوان علی محمدی

سلام دوست عزیز. یک آبجکت برای نگهداری تعداد دفعه تکرار هر کاراکتر ایجاد شده و در قسمت replace بر روی هر کاراکتری که فضای خالی نباشه یک تابع به صورت callback اجرا شده و در این تابع چک میشه که کاراکتر فعلی قبلا در اون ابجکت ست شده یا نه و اگه در اون آبجکت موجود باشه یکی به تعدادش افزوده میشه و در غیر این صورت تعداد برابر یک قرار میگیره.

حامد اعتضادی

دوتا پیشنهاد دارم:
1) درسته که دوره مجازی خوبه، ولی واقعا مثل دوره حضوری نیست و رفع اشکال از دور سخته، ای کاش با یه هزینه کم دوره رفع اشکال بزارید یا به عنوان اشانتیون ارائه بدید شده حتی چند روز
2) برای کسایی که تو دوره شرکت می کنن مدرک صادر کنید، البته به نظرم امتحان بگیرید
در زمینه مدرک می دونم موسسه نیستین اما من یا امثال من که آشنا دارند می تونن کمک کنن
ممنون بابت پاسخگویی خوبتون و تیم خوبتون

کیوان علی محمدی

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

حامد اعتضادی

خوشحال میشم تو جلسه رفع اشکالتون شرکت کنم
کی اطلاع رسانی میشه؟

کیوان علی محمدی

شما دوره های حضوری یا غیر حضوری مگه شرکت کردین؟

حامد اعتضادی

بله، مگه دوره های خریداری شده من معلوم نیست برای شما
فکر کنم از مشتری های پر خرید و فعال شما هستم

کیوان علی محمدی

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

حامد اعتضادی

جایی رو که متوجه نمیشم اینجاست :

یعنی مثلا کاراکتر اول رو بگیر اگر اون کاراکتر مساوی(یا عدم مساوی) درست یا غلط نیست(چون isNaN) فالس و ترو میده حالا برو کانت کن
مگه ترو یا فالس می تونه برابر یه کاراکتر قرار بگیره
احتمال قوی من اشتباه کد رو ترجمه می کنم

کیوان علی محمدی

نه این معنی کاراکتر اول رو نمیده. اون مقدار برابر کاراکتری هستش که از طریق regex تطبیق پیدا کرده و وارد تابع شده (کاراکتری که space نباشه) . بعدش چک شده این کارکتر اگه قبلا در آبجکت uchars ست نشده برابر یک قرارش بده ( آبجکت ها به صورت key => value هستن) و در غیر این صورت یکی به مقدارش در آبجکت اضافه کن. (اگه ست نشده باشه یعنی قبلا یکبار این کارکتر در آبجکت ثبت شده و الان باید تعدادش یک واحد اضافه بشه)

حامد اعتضادی

ممنون از توضیحتون

حامد اعتضادی

سوال بعدی که دارم:

تو کد بالا

و

رو نمی فهمم
محبت می کنین توضیح بدین
ترجمه ساده کنین
ممنون

کیوان علی محمدی

این کد کامل نیست.

angular js بهتره یا react؟
چرا؟

سلام بسته به پروژه فرق داره. انگولار برای برنامه هایی بزرگ تر و مواردی که لاجیک بیشتری در سمت کاربر دارن بهتره ولی react برای برنامه هایی که component base هستند بهتره.

حامد اعتضادی

سلام
من قسمت دوم تو دستور replace رو متوجه نمیشم
محبت می کنین توضیح بدین

$1 یعنی چی؟

لقمان آوند

این رو که توی جلسات عبارت های منظم تدریس کردیم. $1 به مقدار درون اولین پردانتز عبارت منظم اشاره میکنه

محمدرضا

سلام خسته نباشید استاد اوند ایا با جاوا اسکریپت که تحت کلاینت هست میشه با mysql ارتباط برقرار کرد !؟‌
واسه یه وب سایت لوکال میخواهم 😀 !

سلام. خیر نمیشه اینکارو انجام داد.

امیرمحمد رضایی

سلام اقای اوند لطفا ایمیلتون رو چک کنید

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.
1 2