آموزش ساخت منو با استفاده از css

  • توسط کاظمی زاده
  • 11 دیدگاه
  • ترفندها
آموزش ساخت منو با استفاده از css

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

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

برای استفاده از این افکت در منوی سایت خود،
ابتدا در قسمت head سایت خود، فایل jquery.js را ضمیمه کنید. بعد از آن نیز فایل modernizer.js را ضمیمه کنین.

سپس کدهای اسکریپت را بعد از jquery.js بنویسید.

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

ما در ابتدا فایل jquery.js را ضمیمه کردیم که کتابخانه اصلی ماست.

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

مثلا بجای سلکتور $('ul') از $('ul.main_menu') استفاده نمایید

نکته ای که در این کد وجود دارد، وجود یک تگ div با شناسه #marker است. این همان حاشیه ی لغزنده در پایین گزینه های منو است. که با حرکت موس نیز ابجا می شود.

آموزش ساخت منو با استفاده از css 4از 5براساس 701 رای

11 دیدگاه

دیدگاه خود را ارسال کنید

14 + 5 =