We help IT Professionals succeed at work.

nivo slider not loading slideshow on page.

BluesMama asked
I have a web page www.thefencestore.com

there is a nivo slider slide show in the main content and it appears that I have the scripts installed and configured properly but it won't work. The slideshow does not load.

I'm wondering if it is because I have another rotating js on the sidebar and it's causing a conflict? I'm working under a deadline and need some insight.
Watch Question

Top Expert 2011
Error on page:

Error: $("#slider").nivoSlider is not a function
Source File: http://www.thefencestore.com/
Line: 19

I presume that the function is included in the file "include/jquery.nivo.slider.pack.js"

But, when trying to access the file, a 404 error occurs:
The requested URL /include/jquery.nivo.slider.pack.js was not found on this server.


That certainly did the trick to get the slideshow going but now there are numbers down the center of the images during the slide show.
Top Expert 2011

Glad it was an easy fix for you!

BTW, those numbers are the links to specific slides in your slideshow.  You need to apply some sort of formatting to them if you want them to be pretty.  I see you have CSS for nivoSlider, which appears to be for the slideshow, but I don't see anything for the "controls".
<div class="nivo-controlNav">
<a rel="0" class="nivo-control">1</a>
<a rel="1" class="nivo-control">2</a>
<a rel="2" class="nivo-control">3</a>
<a rel="3" class="nivo-control">4</a>
<a rel="4" class="nivo-control">5</a>
<a rel="5" class="nivo-control">6</a>
<a rel="6" class="nivo-control">7</a>
<a rel="7" class="nivo-control">8</a>
<a rel="8" class="nivo-control">9</a>
<a rel="9" class="nivo-control">10</a>
<a rel="10" class="nivo-control">11</a>
<a rel="11" class="nivo-control">12</a>
<a rel="12" class="nivo-control">13</a>
<a rel="13" class="nivo-control active">14</a>
<a rel="14" class="nivo-control">15</a>
<a rel="15" class="nivo-control">16</a>
<a rel="16" class="nivo-control">17</a>
<a rel="17" class="nivo-control">18</a>
<a rel="18" class="nivo-control">19</a>
<a rel="19" class="nivo-control">20</a>
<a rel="20" class="nivo-control">21</a>
<a rel="21" class="nivo-control">22</a>
<a rel="22" class="nivo-control">23</a>
<a rel="23" class="nivo-control">24</a>
<a rel="24" class="nivo-control">25</a>
<a rel="25" class="nivo-control">26</a>
<a rel="26" class="nivo-control">27</a>
<a rel="27" class="nivo-control">28</a>
<a rel="28" class="nivo-control">29</a>
<a rel="29" class="nivo-control">30</a>
<a rel="30" class="nivo-control">31</a>
<a rel="31" class="nivo-control">32</a>
<a rel="32" class="nivo-control">33</a>
<a rel="33" class="nivo-control">34</a>
<a rel="34" class="nivo-control">35</a>
<a rel="35" class="nivo-control">36</a>
<a rel="36" class="nivo-control">37</a>
<a rel="37" class="nivo-control">38</a>
<a rel="38" class="nivo-control">39</a>
<a rel="39" class="nivo-control">40</a>
<a rel="40" class="nivo-control">41</a>
<a rel="41" class="nivo-control">42</a>

Open in new window


The last comment was very helpful too. Thanks!!