در مطالب قبلی آموزش طراحی سایت، با نحوه ساخت چند نوع منوی متفاوت مبتنی بر CSS و عنصر ul آشنا شدید. در این فیلم آموزش CSS، از ترکیب منوهایی که تا به حال آموخته اید، یک منوی کشویی افقی خواهیم ساخت که جزء پرکاربردترین منوها در CSS می باشد.
می توانید لیست منوهای دیگری که در آنلاینر آموزش داده شده است را در زیر مشاهده کنید :
- منوی کشویی عمودی
- منوی آکاردئونی (کشویی)
- منوی افقی ساده
- منوی عمودی از روی طرح گرافیکی فتوشاپ
- منوی افقی کاربردی و استفاده از تکنیک double border
- تب منوی افقی
- تب منوی عمودی
[hdplay id=121]
برای دانلود فیلم آموزشی و اسنیپت های آموزش مربوطه از لینک های زیر استفاده کنید :
[free_vip]
[video_download cat=’html’ url=’http://dl.onliner.ir/css-videos/horizontal-drop-down-menu.mp4′]دانلود فیلم آموزش ساخت منوی کشویی افقی با CSS[/video_download]
[onliner_button type=”edu-demo” url=’http://dl.onliner.ir/css-snippets/horizontal-dropdown-menu.zip’]دانلود دمو[/onliner_button]
[/free_vip]
دسترسی سریع :
- آموزش قبلی : فیلم آموزش ساخت تب منوی عمودی با CSS و HTML
- آموزش بعدی : فیلم آموزش کدنویسی منوی دراپ داون (Drop Down) افقی براساس طرح گرافیکی
- لیست فیلم ها : فیلم های آموزش جامع CSS
22 دیدگاه دربارهٔ «فیلم آموزش ساخت منوی کشویی افقی با CSS»
سلام اگه ممکنه میشه بگید که چجوری منو با اسکرول کردن صفحه همراه صفحه میاد پایین صفحه یعنی همون منوی متحرک
سلام خسته نباشید و ممنون بابت اموزش میخواستم بگم که این خطارو میده و زیر مجموعه هاش پایین نمیاد ممنون اگه راهنماییم کنید
http://uupload.ir/files/firs_11khta.png
http://pingomarket.com
با عرض سلام و احترام خدمت شما
دانش پذیران عزیز میتوانند سوالات مربوطه را در بخش مباحث دوره ی آموزش تبدیل PSD به HTML مطرح نمایند؛ در خدمت شان خواهیم بود.
سلام من سورس این اموزشو میخوام ممنون میشم بفرستید یه گیر کوچیک دارم به سورس نگاه بندازم متوجه اشکال کدم میشم ممنون
سلام
ممنون از آموزش جامع و خوبتون
یه مشکلی دارم من اینکه تا به ul اصلیم عرض ندم افقی قرار نمیگیره و به شکل تصویر زیر در میاد:
http://uupload.ir/files/16p1_ul_menu.png
و اینکه هر کاری میکنم لیست استایل های زیرمنو هام حذف نمیشن
خوشحال میشم سوالام رو جواب بدید
مرسی
با عرض سلام و احترام خدمت شما
فیلم های آموزش های کامل و جامع تمام جزئیات ساخت منو را می توانید در فهرست آموزش های دوره ی آموزش تبدیل PSD به HTML دنبال بفرمایید.
با سلام و تشکر فراوان از زحمات شما.
میخواستم بگم که اگه سورس تمرینات را هم برای دانلود بگذارید ، اثر خیلی بهتری توی یادگیری داره .
باز هم ممنون
با عرض سلام و احترام خدمت شما
بله کاملا حق با شماست. در دوره های آموزشی چنین کاری را انجام می دهیم منتها در محتوای رایگان بعلت احتمال کپی برداری و استفاده بدون ذکر منبع و نام مولف، مقداری نگرانی داریم.
واقععععا ممنونم
هیچ سایتی ی همچین اموزش جامعی برای منو ندیده بودم
مرسی
عالی بود ممنون
ممنون، عالی بود
باسلام و خسته نباشید ممنون از آموزش های خوبتون یک در خواست داشتم در قسمت منو های کشویی عمودی و افقی در داخل زیر منو ها باز هم زیر منو وجود داشته باشد مانند سایت pedal.ir
چاره این کار چیست لطف کنید اموزش دهید باتشکر.
کدنویسی منوی دراپ داون با html و css در صفحه ی وب
باسلام و احترام زیاد خدمت شما آقای آموزش دهنده ی این آموزش!، خیلی خیلی پیچیده توضیح میدید و قابل فهم نیست مطالبتون!
سلام خدمت شما دوست عزیز.سعی شده که آموزش ها در ساده ترین شکل ممکن و به صورت کاربردی توضیح داده بشه. شما باید ابتدا فیلم های آموزشی قبلی ما رو مشاهده کنید تا خیلی راحت تر بتونید این آموزش رو یاد بگیرید
سلام ممنون از آموزشاتون واقعاً عالی هستن میشه یه آموزش جی کوئری هم برای استایل دهی و افکت ها بزارید ممنون میشم!
بله حتما در برنامه های آینده قرار میدیم
برای حرکت دادن یک div باید مقدار position:fixed باشه اینطور با بالا و پایین شدن صفحه اون قسمت هم متحرکه
با عرض سلام و احترام خدمت شما
ما در این جلسه ی آموزشی تنها قصد ساخت منوی کشویی داشتیم، و نه منویی که لزوما با اسکرول شدن صفحه نیز ثابت باشد.
با سلام
بنده یک قالب دارم زیر مجموعه فهرست های اصلی ام به صورت عمودی باز می شود . یعنی به صورت معمول که زیر مجموعه ها باید از راست به چب باز شود روی یک دیگر باز می شود.
چاره چیست؟
با تشکر
سلام و احترام
میتونید به li های منو float:right; یا float:left; بدید.
کنار هم جیده میشن آیتم ها.
البته والد آیتم ها باید عرض مناسب برای جاشدن تمام آیتم ها کنار هم رو داشته باشه.
سلام ممنونم ، عالی بود