تالار گفتمان nCIS.ir

نسخه‌ی کامل: مشکل با منو DropDown در بوت استرپ
شما در حال مشاهده نسخه آرشیو هستید. برای مشاهده نسخه کامل کلیک کنید.
سلام 
من از یک منوی ترکیبی navbar- inverse بوت استرپ با DropDown برای وب سایتم استفاده کردم ولی با هاش دچار این مشکلات زیر شدم لطفا راهنمایی می فرمایید چه جوریمشکل را حل کنم :

1) اگر فایل bootstrap.rtl.min.js را اضافه کنم قسمت DropDown کلا از کار می افته و وقتی غیرفغالش می کنم درست میشه .چه جوری تنظیمش کنم که با اضافه کردن این فایل منو dropdown از کارنیفته؟
2) وقتی فایل bootstrap.rtl.min.js را غیرفعال می کنم منو dropdown فعال میشه ولی توی حالت ریسپانسیو منوهاش و زیر منوهاش بهم میریزه و نمیشه باهاش کار کردم (شکل زیر) .چه جوری درستش کنم؟


[attachment=368

این هم سورس کد :
<!DOCTYPE >
<html >
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/x-icon" href="images/faveicon.ico"/>
<title>Pasargad Here</title>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" href="css/bootstrap.min.css"  media="all"/>
<link rel="stylesheet" href="css/bootstrap.rtl.min.css" media="all" />
<link rel="stylesheet" href="css/font-awesome.min.css" media="all" />
<link rel="stylesheet" href="css/mainstyle.css" media="all" />
<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>-->
<script src="js/jquery-1.12.0.js"></script>
<script src="js/bootstrap.min.js"></script>
<!--<script src="js/bootstrap.rtl.min.js"></script>-->

</head>

<body>
   <div class="page">
     <nav id="header" class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">اینجا پاسارگاد</a>
    </div>
    <div id="navbar" class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
	     <li id="map-link"><a href="#">گالری</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">درباره ما<span class="caret"></span></a>
            <ul id="submenu " class="dropdown-menu" role="menu">
             <li><a href="#">ایده اولیه</a><li>
			 <li><a href="#">درباره ما</a><li>
			 <li><a href="#">اهداف ما</a><li>
			 <li><a href="#">مجوزها</a><li>
			 <li><a href="#">حرف آخر</a><li>
            </ul>
        </li>
        
        <li id="list-link"><a href="#">تماس باما</a></li>
		<li id="more-link"><a href="#">مجوزها</a></li>
        <li id="locate-link"><a href="#">همکاران</a></li>
        <li id="more-link"><a href="#">ثبت نام</a></li>
		<li id="more-link"><a href="#">ورود</a></li>
      </ul>
    </div>
  </div>
</nav><!-- /#mynavbar -->
       </div><!--/.container-fluid -->
   </nav><!-- /.nav -->
   
     <section class="mycontent"></section><!-- EndOfSection -->
      
     
   </div><!-- /.page -->
 
</body>
</html>

لطفا راهنمایی می کنید.کلافه ام کرده هرچه تلاش می کنم درست نمیشه.
فایل مینیفای شده جاوا اسکریپت Bootstrap RTL مشکل داره. فایل معمولی رو لود کنید (bootstrap.rtl.js)
سلام
فایل معمولی روی وب گذاشتم (bootstrap.rtl.js) و لود کردم ولی هنوز هر جفت مشکل بالا سر جاش هست و دوباره با همون مشکلات مواجه شدم. الان چه جوری درستش کنم؟
بوت استرپ RTL رو از کجا گرفتین؟ اگه از WebDesignerMag گرفته باشین لازم نیست دیگه فایلهای اصلی بوت استرپ رو لود کنید.
سلام
بله اقای شهرکی از همین وب سایت که شما می فرمائید دانلود کردم.
خوب پس دیگه فایلهای اصلی بوت استرپ رو لود نکنید.
نه تمام فایلهای css و js را ازهمین وب سایت دانلود کردم و توی وب گذاشتم و فایلهای اصلی را پاک کردم ولی دوباره کار نمی کنه .همین که bootstrap.rtl.min.js یا bootstrap.rtl.js غیر فعال میشه درست میشه و کارمی کنه ولی با فعال شدن این فایلها از کار میفته .
باید کدتون رو از نزدیک بررسی کنم. درصورت امکان ZIP شده اش رو بگذارین فردا چک کنم.
این هم فایل zip  منو من  

[attachment=373]

ممنون
سلام آقای شهرکی ببخشید کد من را دیدید؟مشکل از کجاست؟
به همین سادگی درست شد:
<!Doctype html>
<html>
<head>
<title>DropDownMenu With BootStrap</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="css/bootstrap.rtl.css">
  <style>
     @media (max-width: 767px) {
  .navbar-inverse .dropdown-menu .radio label:
     color: #fff;
     background-color: transparent;
  }
}
.dropdown-menu{
  padding:5px;
}
  </style>
</head>
<body>

<nav id="header" class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Brand</a>
    </div>
    <div id="navbar" class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
            <ul class="dropdown-menu" role="menu">
             <li><a href="#">Menu1</a><li>
			 <li><a href="#">Menu1</a><li>
			 <li><a href="#">menu1</a><li>
            </ul>
        </li>
        <li id="map-link"><a href="#">Search</a></li>
        <li id="list-link"><a href="#">Actions</a></li>
        <li id="locate-link"><a href="#">Locate</a></li>
        <li id="more-link"><a href="#">More</a></li>
      </ul>
    </div>
  </div>
</nav>
  <!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>-->
  
  <script src="js/jquery-1.12.0.js"></script>
  <script src="js/bootstrap.rtl.js"></script>

</body>
</html>

هیچوقت JS رو قبل از محتوای صفحه لود نکنید.
ممنونم آقای شهرکی .
گذاشته بودم آخر کار فایلهای js را بیارم پایین صفحه ولی یه سوال دیگه :پس اگر مشکل از این هست چرا با لود bootstrap.min.js چنین مشکلی درست نمیشد؟؟!!!
چون اون خودش کدها رو داخل $(document).ready(...) گذاشته