$( '#滑块')nivoSlider();不是一个功能

时间:2013-07-02 00:40:13

标签: jquery web slider nivo-slider

首先,我一直在看类似的问题,但这里没有任何结果是我的问题。

我能够在本地完全设置nivo滑块,但是当我复制并粘贴完全相同的东西时,我正在谈论文件夹中的文件夹和可能性到我的webhotel我得到以下错误:

$('#slider').nivoSlider(); is not a function

我已经工作了好几个小时而没有结果,它开始让我生气了:S

这里是我的文件夹结构的一些图像,我突出显示了重要文件的位置:

我的索引文件

<!DOCTYPE html>
<?php
include 'includes/page.class.php';
$url = isset($_REQUEST['url']) ? $_REQUEST['url'] : null;
$page = ($url != null) ? new page($url) : new page();
?>
<html>
<head>

<link href="site/css/custom.css" rel="stylesheet" type="text/css"
  media="screen" />
<link href="site/css/template.css" rel="stylesheet" type="text/css"
  media="screen" />
  <link href="themes/bar/bar.css" rel="stylesheet" type="text/css"
  media="screen" />
<link href="site/css/hint.css" rel="stylesheet" type="text/css"
  media="screen" />
<link href="fancybox/jquery.fancybox.css" rel="stylesheet" type="text/css" media="screen" />


<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript" src="Javascripts/index.js"></script>
<script type="text/javascript" src="Javascripts/kontakt.js"></script>
<script type="text/javascript" src="Javascripts/ommig.js"></script>
<script type="text/javascript" src="Javascripts/projekter.js"></script>
<script type="text/javascript" src="Javascripts/android.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox.pack.js"></script>

<title><?php echo $page->getTitle() ?>
</title>
</head>
<body>
  <div id="wrapper">
    <div id="header">
      <nav class="menu">
        <ul>
          <li><a href="forside.php" id="mainsite">Forside</a></li>
          <li><a href="projekter.php" id="mainsite">Projekter</a></li>
          <li><a href="ommig.php" id="aboutme">Om mig</a></li>
          <li><a href="kontakt.php" id="mainsite">kontakt</a></li>
        </ul>
      </nav>
      <hr>
    </div>
    <div id="page">
      <div id="content">
        <?php echo $page->loadPage() ?>
      </div>
    </div>
    <div class="slider-wrapper">
    <div id="slider" class="nivoSlider">
        <img src="images/nemo.jpg" alt="" />
        <a href="http://dev7studios.com"><img src="images/toystory.jpg" alt="" title="#htmlcaption" /></a>
        <img src="images/up.jpg" alt="" title="This is an example of a caption" />
        <img src="images/walle.jpg" alt="" />
    </div>
</div>
<div id="htmlcaption" class="nivo-html-caption">
    <strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
</div>
    <script type="text/javascript">
    $(window).load(function () {
        $('#slider').nivoSlider();
    });
    </script>
    <div id="footer">
      <hr>
      <div id="credits">
        <p style="text-align: center;">
          <b>&copy; Design by | Marc Rasmussen</b>
        </p>
      </div>
    </div>
  </div>
</body>
</html>

My folder that contains my website

Firebug消息

enter image description here

2 个答案:

答案 0 :(得分:4)

您应该在jQuery之前找到nivoSlider

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>

答案 1 :(得分:3)

对我而言,问题是您使用之前的幻灯片需要jQuery。

<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

应该是

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>