shams 17 خرداد 1394 4 724 بازدید آموزش طراحی سایت

در فیلم آموزشی قبل، نحوه ی ساخت منوی اصلی وب سایت را به صورت بدون عمق خدمت تان آموزش دادیم؛ و اما در این فیلم آموزشی و در ادامه ی مباحث آموزش طراحی صفحات وب پیشرفته، به سراغ آموزش کدنویسی و ساخت منوی دراپ داون وب سایت به وسیله ی html و css می رویم. البته در این آموزش منوی دراپ داون (منوی کشویی) را به صورت pure css (سی اس اس محض) میسازیم اما در ادامه ی آموزش های دوره طراحی صفحات وب پیشرفته، به سراغ آموزش ساخت منوی کشویی به وسیله ی jQuery – جی کوئری نیز می رویم. یعنی منوهایی می سازیم که به صورت آهسته و با یک افکت نرم و کشویی باز شوند.

در این فیلم آموزش طراحی سایت پیشرفته تقدیم می شود:

  • آموزش ترکیب منوی افقی و منوی عمودی در طراحی صفحات وب جهت ساخت عمق دو به صورت دراپ داون
  • آموزش ساخت عمق 3 در منوی دراپ داون و پیاده سازی آن به وسیله ی HTML, CSS
  • تنظیم فاصله ی بین عمق یک و زیر منوی دراپ داون در کدنویسی منوی صفحه ی وب
  • رفع مشکل پنهان شدن منوی دراپ داون هنگام برداشته شدن ماوس از روی عنصر والد در منوی سایت
  • جداسازی عناصر منوی دراپ داون صفحه بر اساس طرح گرافیکی

زمان این فیلم آموزشی یک ساعت و 6 دقیقه و 27 ثانیه است.

جهت دانلود فیلم آموزش کدنویسی منوی دراپ داون با html و css در صفحه ی وب بر روی لینک زیر کلیک نمایید:

خرید این فیلم آموزشی به صورت تک (3500 تومان) :
35,000 ریال – خرید
ثبت نام و دسترسی کامل به تمام فیلم ها و محتوای دوره آموزش حرفه ای طراحی صفحات وب (تبدیل PSD به HTML) قبلا ثبت نام کرده ام؛ ورود

دسترسی سریع :

نظرات کاربران (4)



  1. سحر

    با سلام
    وقتی li سطح یک رو inspect میکنم در قسمتی که براش زیر منو قرار دادم تمام محدوده ul سطح دو رو هم جزء عرض و ارتفاع آن قرار میده برای همین وقتی ماوس رو به محدوده زیر منو هم که میبرم ،زیر منو نمایش داده میشود. میخواستم بدونم علتش چیه؟
    با تشکر

    • shams

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

  2. only tiger

    سلام
    یم مشکلی که من دیدم وقتی موس رو بالاتر از برنامه ها قرار میدیم یعنی خارج از اون کادر hover که به رنگ آبی در میاد باز هم منو ما باز میشه و این به خاطر padding هست که ما به li دادیم آیا راهی هست که این مشکل رو نداشته باشه به نظرم زیاد جالب نیست اینم عکسش ببنید موس کجاست که منو باز شده
    http://8pic.ir/images/tofy8vdsq4wank75hb2n.png

    • shams

      سلام.بله حق با شماست و مشکل دقیقا paddingای هست که به li داده شده. شما میتوانید به جای دادن padding به li ها، به آن ها margin بدید تا مشکل حل بشه.فقط دقت کنید که باید برای liهای درونی هم به جای padding، مارجین رو صفر قرار بدین و همچنین مقدار زیر رو تغییر بدین تا زیر منو نمایش داده بشه :
      #main-menu ul li:hover > ul {
      top: 25px;
      }