$('#slider').nivoSlider(); is not a function
First of all i have been looking at the similar question but without any results here is my problem.
I am able to set up the nivo slider perfectly fine locally, however when i copy and paste the EXACT same thing and im talking about both folder and possition in folders to my webhotel i get the following error:
$('#slider').nivoSlider(); is not a function
Ive been working for hours now with no result and its starting to piss me off :S
here are some images of my folder structure i have highlighted the spot of where the important files are:
My index file
<!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>© Design by | Marc Rasmussen</b>
</p>
</div>
</div>
</div>
</body>
</html>
Firebug message
Answer
You should source jQuery before 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>