prettyPhotos nav loading on page load - not working
  • Theirs something strange going on with my site. All the correct files are being loaded (i think) and im pretty sure ive set up the links correctly.

    When i refresh the page i get links which relate to the navigation within prettyPhoto at the bottom of the screen outside the main body of the site and the page length is massive.

    Its a bit difficult to explain but....
    (only 1 image in the gallery at the moment for testing)

    any pointers would be greatly appreciated.


  • It looks like there's an extraneous directly below the ...... appears to overlapping or unclosed.
  • Thanks for picking that up but that isn't the main issue, I have fixed the unclosed div now and that hasnt helped.

    It seems to be if i have any other css file being referenced it breaks the install.

    I've added two pages to test this (working)
    and (not working)

    test1.html does not reference any other css files
    test2.html does.

    it isnt a syntax issue in the referenced file it only contains:


    Any other ideas?


  • Have tested it all locally (i.e. downloaded all the files you've created and set up on my machine) and it seems to work fine.

    Posted it live here

  • I may be missing something but the link you sent me doesnt work as a light box. clicking on the image just loads a new page with the image in. also the two referenced css files are not present on the server and so i dont think this will prove whether their is a conflict with the other css files.

    Thanks for your help

  • ditch the forward slash you had put in before your css reference e.g. href="stylesheets/prettyPhoto.css"

    .... the previous link now works and you can see the css
  • scrub last comment...still not working.

    Will try with fresh scripts.
  • Right...think I've cracked it.....hope you don't mind, but I nicked a couple of images from your site to work with. Looks like it was the javascript you had running inside the . This needed to go right at the end, just inside the tag, after all of the image references.

    I also restructured the folders as per the prettyPhoto download, just in case there is any referencing between the JS and CSS files within the code. I also subbed the CSS and JS from the prettyPhoto download package.

    Seems to be working fine now. Don't forget you'll also need the 'prettyPhoto' folder that comes with the download as this contains the sprite for overlay graphics such as the close/next/prev buttons etc.
    Try to keep the folder structure the same as the downloadable source file...

    Feel free to view source and take the code if it helps.

  • Ok i got a bit further as well. ive managed to get the script to run but i ts not finding the image.

    Im using radiant cms tags to generate the list so i guess its down to me to sort out where its going wrong, still its strange because it can fond the images to populate the thumbs but not the large images: (if your interested radiant code below)

    Thanks very much for all your help.

  • This is really confusing! It seems to load the small images fine but just wont load the larger images when you click on them.

    If anyone can think of anything obvious, again help would be greatly appreciated.



Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Login with Facebook Sign In with Google Sign In with OpenID Sign In with Twitter