2013-04-10 64 views
1

我遇到一個滑動導航和一個滑塊之間發生衝突的jQuery的問題。任何幫助,將不勝感激!在Chrome中控制檯,我得到:未捕獲的ReferenceError - jQuery的衝突

Uncaught ReferenceError: $ is not defined smooth-scroll.js:2 
Uncaught ReferenceError: jQuery is not defined jquery.sticky.js:112 
Uncaught ReferenceError: jQuery is not defined jquery.fancybox-1.3.4.pack.js:46 
Uncaught ReferenceError: jQuery is not defined 
Uncaught ReferenceError: jQuery is not defined jquery.mousewheel-3.0.4.pack.js:14 
Uncaught ReferenceError: $ is not defined index.html:46 
Uncaught ReferenceError: $ is not defined index.html:52 

這裏是我的頭:

<head> 
    <meta charset="utf-8"> 
    <title>DCC Marketing - Decatur Illinois Public Relations, Advertising, Strategic Planning, & Web Development</title> 
    <meta name="description" content="" /> 
    <meta name="keywords" content="" /> 
    <meta name="robots" content="" /> 

    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Oxygen"> 
    <link href="css/reset.css" rel="stylesheet" type="text/css" /> 
    <link href="css/960.css" rel="stylesheet" type="text/css" /> 
    <link href="css/styles.css" rel="stylesheet" type="text/css" /> 
    <link href="fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css" /> 


    <link rel="stylesheet" href="css/example.css"> 
    <style> 
     body {-webkit-font-smoothing: antialiased;font: normal 15px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;} 
     #slides {display: none;margin-top:36px;} 
     .slidesjs-container {width:1000px;height:252px;margin-bottom:-21px;} 
     #slides .slidesjs-navigation {margin-top:-17px;visibility: hidden;} 
     #slides .slidesjs-previous {margin-right: 5px;float: left;visibility: hidden;} 
     #slides .slidesjs-next {margin-right: 5px;float: left;visibility: hidden;} 
     .slidesjs-pagination {margin: 0px 6px 0;float: right;list-style: none;position:relative;z-index:1000;} 
     .slidesjs-pagination li {float: left;margin: 0 1px;} 
     .slidesjs-pagination li a {visibility:hidden;display: block;width: 14px;height: 0;padding-top: 14px;background-image: url(images/pagination.png);background-position: 0 0;float: left;overflow: hidden;} 
     .slidesjs-pagination li a.active, 
     .slidesjs-pagination li a:hover.active {background-position: 0 -14px} 
     .slidesjs-pagination li a:hover {background-position: 0 -28px} 
     #slides a:link, 
     #slides a:visited {color: #333} 
     #slides a:hover, 
     #slides a:active {color: #9e2020} 
     .navbar {overflow: hidden} 
    </style> 

    <script type="text/javascript" src="js/smooth-scroll.js"></script> 
    <script type="text/javascript" src="js/jquery.sticky.js"></script> 
    <script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.pack.js"></script> 
    <script type="text/javascript" src="js/jquery.easing-1.3.pack.js"></script> 
    <script type="text/javascript" src="fancybox/jquery.mousewheel-3.0.4.pack.js"></script> 
    <script type="text/javascript" src="cform.js"></script> 

<script type="text/javascript"> // sticky nav bar 
    $(document).ready(function(){ 
    $("nav").sticky({topSpacing:0}); 
    }); 
</script> 

<script type="text/javascript"> // fancybox 
$(document).ready(function() { 

    $("a.single_image").fancybox(); 

    $("a#inline").fancybox({ 
     'hideOnContentClick': true 
    }); 

    $("a.group").fancybox({ 
     'transitionIn' : 'elastic', 
     'transitionOut' : 'elastic', 
     'speedIn'  : 600, 
     'speedOut'  : 900, 
     'overlayShow' : false 
    }); 

}); 
</script> 
</head> 

這裏是從那裏將滑塊設置在機身的代碼:

<div id="slides"> 
    <img src="images/flash1.png"> 
    <img src="images/flash2.png"> 
    <img src="images/flash3.png"> 
     <a href="#" class="slidesjs-previous slidesjs-navigation"><i class="icon-chevron-left icon-large"></i></a> 
     <a href="#" class="slidesjs-next slidesjs-navigation"><i class="icon-chevron-right icon-large"></i></a> 
    </div> 
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script> 
<script src="js/jquery.slides.js"></script> 
<script> 
$(function(){ 
    $("#slides").slidesjs({ 
    play: { 
     active: true, 
     effect: "slide", 
     interval: 5000, 
     auto: true, 
     swap: true, 
     pauseOnHover: true, 
     restartDelay: 2500, 
     width:936, 
     height:247 
    } 
    }); 
}); 
</script> 

謝謝!

+0

我看見這一切的jQuery插件...你加載jQuery的地方? – tymeJV 2013-04-10 15:06:42

+0

移動你的jquery.js包括對腳本的上面休息,他們需要它。 – 2013-04-10 15:06:53

回答

3

裝載 「JS/jQuery的1.9.1.min.js」 加載 「JS /光滑scroll.js」 之前。

+0

我添加<腳本類型=「文本/ JavaScript的」 SRC =「http://code.jquery.com/jquery-latest.min.js」>到腳本的頂部和得到這個錯誤: 未捕獲的類型錯誤:無法讀取未定義jquery.fancybox-1.3.4.pack.js的特性「MSIE」:18 遺漏的類型錯誤:對象的翻譯:有沒有方法「粘性」的index.html:47 – user2266675 2013-04-10 15:21:35

+1

MSIE是1.9,$支持。瀏覽器不是。 – 2013-04-10 15:30:22

+0

仍然出現錯誤,但我們正在接近! (匿名函數)index.html:52 o jquery-1.7.2.min.js:2 p.fireWith jquery- 1.7.2.min.js:2 e.extend.ready的jquery-1.7.2.min.js:2 c.addEventListener.B的jquery-1.7.2.min.js:2' – user2266675 2013-04-10 15:34:33

2
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script> 

將此移至頂部。它應該包括包括任何其他腳本之前

0

jQuery的JavaScript文件應先加載,所以,試試這個移動頂端

<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script> 
相關問題