طراحی سایت, ساخت ربات تلگرام, آموزش php , سورس کد php ,سورس ربات تلگرام , سورس فروشگاه اینترنتی , آموزش طراحی وب

ساخت منوی جمع شونده با jQuery


ساخت منوی جمع شونده با jQuery می تواند توسط توابع متنوعی مثلا show() , toggle و بیشتر.. انجام شود .

در این آموزش , قصد داریم با استفاده از تابع toggle() در جی کوئری بهره ببریم. در اینجا جهت (direction) را به تابع پاس میدیم که انیمیشن جمع / باز کردن منو را کنترل می کند.

ساخت منوی جمع شونده با jQuery

هدر با قابلیت Expand (بسط یافتن)

کد HTML زیر لیست آیتم های منوی هدر را نمایش می دهد.

و استایل آن بصورت زیر است :

ساخت منوی جمع شونده با jQuery

این اسکریپت جی کوئری از تابع toggle() با جهت به منظور جمع  و باز کردن منو استفاده می کند .

حتما بخوانید  ساخت Sliding Menu با jQuery

همانطور که دید به ساخت منوی جمع شونده با jQuery به چه راحتی می تواند انجام شود.

امیدوارم از این آموزش jQuery نهایت استفاده را برده باشید .

برای دانلود سورس کد کامل این آموزش از باکس دانلود استفاده کنید.

هر سوالی داشتید ، از قسمت نظرات ارسال کنید . سریعا ، پاسخگوی سوالات شما هستیم .

موفق و پیروز باشید.

اگر مفید بود, لطفا به اشترک بگذارید تا دوستان دیگر نیز بهره ببرند

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

دیدگاه کاربران

3 پاسخ به “ساخت منوی جمع شونده با jQuery”

  1. reza panahi گفت:

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

    0
    • حسن شفیعی گفت:

      سلام. ارتباطی به نوع مرورگر نداره. زمانی که فایل را بصورت لوکال باز می کنید آدرس های // برای لود شدن کتابخانه های jquery بصورت صحیح رندر نمی شوند. برای همین میتونید برای کار در سمت لوکال در خط ۵ و ۶ مقدارهای // را به https:// تغییر بدید.

      موفق باشید.

      0
  2. reza panahi گفت:

    تشکر مهندس. حل شد

    0

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دانلود رایگان (هدیه ویژه)

کتاب آموزش زبان برنامه نویسی PHP را دانلود و همین امروز یادگیری را شروع کن و به جمع برنامه نویسان ملحق شو ;)

دانلود رایگان کتاب

آموزش طراحی وب سایت

نظر کاربران عزیز

آموزش های آنلاین در چه زمینه ای تهیه کنیم ؟

  • آموزش جاوااسکریپت و جی کوئری (45%, 10)
  • آموزش ساخت ربات تلگرام (45%, 10)
  • آموزش بوت استرپ 4 (9%, 2)

تعداد رای ها : 22

Loading ... Loading ...

بخش کاربران

هنوز عضو نیستید ؟ کلیک کنید

مجوزهای ما


logo-samandehi نماد اعتماد الکترونیک

دانلود کتاب

عضویت در خبرنامه