Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Nov 2010
    Location
    Devon, UK
    Posts
    44
    Thanks
    6
    Thanked 1 Time in 1 Post

    Question Img Slider Problem

    Hey guys,

    help time again! I've being going ok but for the last 3 hours i been playing with an image slider from http://nivo.dev7studios.com and for the life of me i cant get it working. It looks so simple to setup yet i just cannot get it to come to life.

    http://www.rhombusone.com/projecttiger/index.html is a link to what is in place using the code the site provided and placing images etc in the correct directories on the server. Any help again would be much appreciated on this one as my losing my mind trying to see whats causing problems here

    (ADDED****)

    Scroll down to see the loading.gif , which is the only piece showing from the slider as its just a background image) If anyone thinks perhaps its just a bad choice of slider then by all means tell me to change !

    Cheers

  • #2
    Senior Coder Spudhead's Avatar
    Join Date
    Jun 2002
    Location
    London, UK
    Posts
    1,856
    Thanks
    8
    Thanked 110 Times in 109 Posts
    Two things:

    1. You need to put javascript in the right order. You're currently including the slider code, and the bit that initialises the page on load, before you include the jQuery library. You should include the jQuery library first, then any plugin files (like the slider), then your $(window).load() - or $(document).ready() - calls should come after you've included everything else.

    2. Spotting errors like this is made simple by the Firebug plugin for Firefox. Doing client-side development without Firebug enabled is like doing car maintenance with the bonnet down.

  • Users who have thanked Spudhead for this post:

    Rhombusone (11-24-2010)

  • #3
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,956
    Thanks
    9
    Thanked 727 Times in 721 Posts
    Try changing this:

    Code:
    <script src="js/jquery.nivo.slider.pack.js" type="text/javascript"></script>
    
    <script type="text/javascript">
    $(window).load(function() {
        $('#slider').nivoSlider();
    });
    </script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
    to this:

    Code:
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
    <script src="js/jquery.nivo.slider.pack.js" type="text/javascript"></script>
    
    <script type="text/javascript">
    $(document).ready(function() {
        $('#slider').nivoSlider();
    });
    </script>
    Note amended code to instantiate the slider, and amended order - my Firebug threw an error because we're trying to use jQuery before it's loaded.

  • Users who have thanked SB65 for this post:

    Rhombusone (11-24-2010)

  • #4
    New Coder
    Join Date
    Nov 2010
    Location
    Devon, UK
    Posts
    44
    Thanks
    6
    Thanked 1 Time in 1 Post
    fixed, thanks guys, really appreciated the help. Can't believe is was just purely about listing the items correctly although aafter you pointed out it makes complete sense. Thanks again guys!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •