6 پست در این موضوع قرار دارد

سلام دوستان

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

ممنون

0

به اشتراک گذاری این پست


لینک به پست

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

اگر از لیست منو خود بوتسترپ استفاده شده باشه معمولا یک کد جی‌کوئری میزارن برای نمایش منوها با hover شدن!

1

به اشتراک گذاری این پست


لینک به پست
در 11 ساعت قبل، masoudch گفته است :

سلام دوستان

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

ممنون

درود

از کدام نسخه بوت استرپ استفاده میکنید ؟ منوی که داخل خود سایت بوت استرپ هست تا وقتی روی آن کلیک نشه باز نمیشه !

همچنین توجه داشته باشید چنین کدی در فایل CSS قالبتان موجود نباشد

@media (min-width:768px) {
ul.nav li.dropdown:hover > .dropdown-menu {
    display: block;
}
}

 

1

به اشتراک گذاری این پست


لینک به پست
در در 11/28/2017 at 22:39، djmostafa گفته است :

درود

از کدام نسخه بوت استرپ استفاده میکنید ؟ منوی که داخل خود سایت بوت استرپ هست تا وقتی روی آن کلیک نشه باز نمیشه !

همچنین توجه داشته باشید چنین کدی در فایل CSS قالبتان موجود نباشد


@media (min-width:768px) {
ul.nav li.dropdown:hover > .dropdown-menu {
    display: block;
}
}

 

سلام از نسخه 3.3.7 و از nav-walker برای ایجاد زیر منوهای بیشتر استفاده میکنم. اما بازم مشکل درست نشده.

ممنون میشم کمک کنید.

0

به اشتراک گذاری این پست


لینک به پست
در 7 ساعت قبل، masoudch گفته است :

سلام از نسخه 3.3.7 و از nav-walker برای ایجاد زیر منوهای بیشتر استفاده میکنم. اما بازم مشکل درست نشده.

ممنون میشم کمک کنید.

ادرس سایتتون رو بزارین تا بشه بررسی کرد .

0

به اشتراک گذاری این پست


لینک به پست
در 22 ساعت قبل، djmostafa گفته است :

ادرس سایتتون رو بزارین تا بشه بررسی کرد .

لوکال هاسته. هنوز سایت نشده.

 

0

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری

  • مطالب مشابه

    • توسط javadmezgi
      با سلام و احترام خدمت همه برنامه نویسان عزیز.
      سایتی که که من با قالب آماده راه اندازی کردم، زیر منو ها رو نمایش میده
      اما
      این زیر منو ها کنار هم چیده می شوند.
      لطفا سایت رو مشاهده کنید
      hb2018.ir
       
      من میخوام که این زیر منو ها ، زیر هم قرار بگیرند نه کنار هم
      لطفا راهنمایی کنید
      با عرض پوزش با کد نویسی آشنایی ندارم. کد بخش mega meno رو از قسمت style.css  براتون در زیر آوردم.
      لطفا اگر نیاز به ویرایش داره راهنمایی کنید
      #top-menu{ -webkit-box-shadow: 1px 1px 7px rgba(0,0,0,.2); -moz-box-shadow: 1px 1px 7px rgba(0,0,0,.2); box-shadow: 1px 1px 7px rgba(0,0,0,.2); } .navbar, .dropdown-menu, .navbar .nav>li>a, .dropdown-menu>li>a, .nav{ font-size: 14px; } .navbar-brand { font-size: 15px; } .megamenu>li>a, .navbar .navbar-nav>li>a { padding-right: 5px; padding-left: 5px; } .megamenu .menu-item-description { text-indent: 20px; } .megamenu .submenu-link { margin-bottom: 5px; padding: 5px; } .megamenu .dropdown-menu { padding-top: 10px; } .megamenu .dropdown-menu * { z-index: 10000; -webkit-backface-visibility: hidden; /* fix for chrome white flash */ } .megamenu .dropdown-menu a.submenu-title-link:hover, .megamenu .dropdown-menu a.submenu-child-link:hover{ font-weight: bold; padding-right: 0; padding-left: 10px; } .dropdown-menu { -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-duration: .5s; animation-duration: .5s; } .megamenu .dropdown { position: static !important; } .megamenu .dropdown-menu a, .megamenu .menu-item-description{ display: block; } .megamenu .dropdown-menu * { white-space: nowrap; } @media screen and ( min-width: 768px ) { .megamenu > li.dropdown:hover > ul.dropdown-menu, .megamenu .open > .dropdown-menu { left: auto; display: table; border-right: 2px solid red; max-width: 85%; } .megamenu .menu-col { display: table; } } @media screen and ( max-width: 768px ) { .megamenu .nav{ display: initial; } .megamenu .open > .dropdown-menu { display: block; } .megamen .dropdown-menu li { display: block; } } .navbar-right.megamenu .dropdown-menu { left: auto; right: 1; } #bottom-navbar-collapse{ text-align: center; } #bottom-navbar-collapse .navbar-nav{ display: inline-block; float: none; } #bottom-navbar-collapse .navbar-nav>.active>a { background-color: inherit; background-image: inherit; -webkit-box-shadow: inherit; box-shadow: inherit; }  
    • توسط unid_user
      درود
      برای داینامیک کردن یک منو به مشکل خوردم و واقعا خیلی برام سخته که با توابع وردپرس این منو رو داینامیک کنم. لطفا اگه کسی میتونه کمک کنه؟
      <div class="header-holder hidden-xs hidde-sm"> <div class="logo-wrap"> <div class="logo-resize"></div> <div class="logo">منوی خیلی سخت</div> </div> <ul> <li class="enable-hover" data-menu-position="1" id="about-hmenu"><span class="hoverColor"></span><a href="about.html"><i class="fa fa-user-o"></i>درباره ما</a></li> <li class="enable-hover" data-menu-position="7" id="contact-hmenu"><span class="hoverColor"></span><a href="contact.html"><i class="fa fa-phone"></i>تماس با ما</a></li> <li class="enable-hover" data-menu-position="9" id="blog-hmenu"><span class="hoverColor"></span><a href="blog.html"><i class="fa fa-graduation-cap"></i>آموزش</a></li> <li class="enable-hover" data-menu-position="10" id="portfolio-hmenu"><span class="hoverColor"></span><a href="portfolios.html"><i class="fa fa-handshake-o"></i>نمونه کارها</a></li> <li class="enable-hover" data-menu-position="11" id="services-hmenu"><span class="hoverColor"></span><a href="services.html"><i class="fa fa-laptop"></i>خدمات</a></li> </ul> </div>  
    • توسط unid_user
      سلام دوستان
      من با نمایش زیر منوها در حالت موبایل مشکل دارم و فقط یک گروه از زیر منو ها رو نمایش میده. فایل رو هم پیوست کردم لطفا راهنمایی کنید.
      سپاس گذار
      test.zip
    • توسط unid_user
      سلام دوستان
      لطفا اگه نمونه کد یا روشی برای داینامیک کردن منوی بوت استرپ با 5 زیر منو دارید کمک کنید. اگه وبسایتی هم هست که آموزش داده باشه لطفا معرفی کنید حتی انگلیسی.
      خیلی ممنون.
      <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li><a href="#">صفحه اصلی</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-submenu>منوی اصلی<span class="caret"></span></a> <ul class="dropdown-menu"> <li class="dropdown-submenu"><a href="#">زیر منوی 1</a> <ul class="dropdown-menu"> <li class="dropdown-submenu"> <a href="#">زیرمنو 2</a> <ul class="dropdown-menu"> <li class="dropdown-submenu"><a href="#">زیرمنو 3</a> <ul class="dropdown-menu"> <li class="dropdown-submenu"><a href="#">زیر منو 4</a> <ul class="dropdown-menu"> <li><a href="#">زیرمنو 5</a></li> </ul> </li> </ul> </li> </ul> </li> </ul> </li> </ul> </li> </ul> </div> </div> </nav>  
      index.html
    • توسط reza_yki
      سلام وقت بخیر به آدرس زیر برید:
      https://demo.tagdiv.com/newspaper/

      به قسمت DON'T MISS (باکس زرد رنگ) توجه کنید

      منویی در ابتدای این باکس هست که با کوجک کردن صفحه از قسمت قابل نمایش منو به قسمت زیر منو منتقل میشه و در هنگام بزرگ کردن صفحه از زیر منو به قسمت قابل دیدن میاد
      من کد زیر رو از فایلش پیداکردم ولی متوجه نحوه کارش نشدم:
      /** * pulldown lists * */ jQuery('.td-subcat-filter').each(function(index, element) { var jquery_object_container = jQuery(element); var horizontal_jquery_obj = jquery_object_container.find('.td-subcat-list:first'); var vertical_jquery_obj = jquery_object_container.find('.td-subcat-dropdown:first'); if (horizontal_jquery_obj.length == 1 && vertical_jquery_obj.length == 1) { var pulldown_item_obj = new td_pulldown.item(); pulldown_item_obj.horizontal_jquery_obj = horizontal_jquery_obj; pulldown_item_obj.vertical_jquery_obj = vertical_jquery_obj; pulldown_item_obj.horizontal_element_css_class = 'td-subcat-item'; pulldown_item_obj.container_jquery_obj = horizontal_jquery_obj.parents('.td_block_wrap:first'); pulldown_item_obj.excluded_jquery_elements = [horizontal_jquery_obj.parent().siblings('.block-title:first')]; td_pulldown.add_item(pulldown_item_obj); } }); jQuery('.td-category-siblings').each(function(index, element) { var jquery_object_container = jQuery(element); var horizontal_jquery_obj = jquery_object_container.find('.td-category:first'); var vertical_jquery_obj = jquery_object_container.find('.td-subcat-dropdown:first'); if (horizontal_jquery_obj.length == 1 && vertical_jquery_obj.length == 1) { var pulldown_item_obj = new td_pulldown.item(); pulldown_item_obj.horizontal_jquery_obj = horizontal_jquery_obj; pulldown_item_obj.vertical_jquery_obj = vertical_jquery_obj; pulldown_item_obj.horizontal_element_css_class = 'entry-category'; pulldown_item_obj.container_jquery_obj = horizontal_jquery_obj.parents('.td-category-siblings:first'); td_pulldown.add_item(pulldown_item_obj); } });

      ممنون