jQuery和導航欄按鈕

Question

我一直有涉及jQuery和我的導航欄按鈕一些麻煩。 讓我解釋一下litte更詳細的問題。 所以，我犯了一個網站使用引導至極包括jQuery的1.11.2，一切都很好，直到我決定使用的fancybox創建一些谷歌地圖的燈箱。 （我的谷歌API使用jQuery 1.7.1），這是當事情開始失敗。 我發現我的導航欄響應按鈕沒有工作jQuery的內部消除1.11.2（我之前禁用），所以我把它再次，但我的地圖收藏沒有工作 如何我在導航欄使用jquery 1.7.1？我找不到任何代碼行。 Here`s我爲我的導航欄

<!-- Home --> 
<section class="header" id="header"> 

    <nav class="navbar navbar-default" id="navigation-bar"> 
     <div class="container"> 
     <!-- Brand and toggle get grouped for better mobile display --> 
      <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> 
       <a class="navbar-brand" href="http://www.ecomotor.cl">Ecomotor</a> 
      </div> <!-- /.navbar-header --> 


     <!-- Collect the nav links, forms, and other content for toggling --> 
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
       <ul class="nav navbar-nav navbar-right"> 
        <li><a href="#header">Inicio</a></li> 

        <li><a href="#service">Despacho</a></li> 
        <li><a href="#portfolio">Galeria</a></li> 
        <li><a href="#about">Acerca de</a></li> 
        <li><a href="#contact">Contacto</a></li> 
       </ul> <!-- /.nav --> 
      </div><!-- /.navbar-collapse --> 
     </div><!-- /.container --> 

和下面的代碼是用JS（其中有谷歌的API）

<!-- Grab Google CDN's jQuery, fall back to local if offline --> 

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    <script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.1.min.js"><\/script>')</script>  
<!-- FancyBox --> 
    <script src="assets/js/fancybox/jquery.fancybox.js"></script> 
    <script src="assets/js/fancybox/jquery.fancybox-buttons.js"></script> 
    <script src="assets/js/fancybox/jquery.fancybox-thumbs.js"></script> 
    <script src="assets/js/fancybox/jquery.easing-1.3.pack.js"></script> 
    <script src="assets/js/fancybox/jquery.mousewheel-3.0.6.pack.js"></script> 

    <script type="text/javascript"> 
     $(document).ready(function() { 
      $(".various").fancybox({ 
       maxWidth : 800, 
       maxHeight : 600, 
       fitToView : false, 
       width  : '70%', 
       height  : '70%', 
       autoSize : false, 
       closeClick : false, 
       openEffect : 'elastic', 
       closeEffect : 'none' 
      }); 
     }); 
    </script> 

<script src="assets/js/jquery-1.11.2.min.js"></script>(if i delete this line, my maps work perfectly but not my navbar button, the opposite happens if i keep it) 
<script src="assets/js/bootstrap.min.js"></script> 
<script src="assets/js/owl.carousel.min.js"></script> 
<script src="assets/js/contact.js"></script> 
<script src="assets/js/script.js"></script> 

我感謝所有幫助，你們可以給我帶來:)

Answer 1

使用單一的jQuery版本

1. 刪除此行：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

刪除此行：

<script src="assets/js/jquery-1.11.2.min.js"></script>

將這個行中的所有其他<script>之前標籤：

<script src="assets/js/jquery-1.11.2.min.js"></script>

這樣，你有你自己的網頁上只有一個jQuery的版本，此版本將被收藏和導航欄響應按鈕都可以使用。

使用兩個jQuery的版本

如果你確實需要使用jQuery的兩個版本你的頁面上，經由jQuery.noConflict()是可能的。

在這裏看到一個例子：

Can I use multiple versions of jQuery on the same page?