Need to stop Previous or Next buttons from loading non-existent images
  • Hi. I'm using PrettyPhoto.js here in this gallery

    Everything works fine except for one thing, I need to be able to control the Previous/Next button action so that it can identify an added class to the housing the image and make a decision.

    Here's what's happening:

    The gallery content is drawn dynamically from the database; the tool the client uses to load images into the project gallery lets the project have up to 8 images, for projects that have less than the full capacity I have set the CSS to hide un-needed thumbnail images
    .pp_gallery li.default{display:none !important;}
    This stops a black thumbnail image appearing for any remaining places that haven't been filled of the 8. This all works well.

    However, the Previous and Next buttons need to be controlled so that once they get to the end of the gallery's amount of images, say there are 4, going to the next position (5) creates a 'hung loop' where the gallery is unable to find an image (or the 8th image if going to the Previous image from position 1), it needs to go to image , or from image 1 to the next filled image under position 8.

    It is possible for me to add define a class to the gallery markup in the client image loading tool, but where in PrettyPhoto.js do I make the adjustments? And what adjustments (I'm not very advanced in jquery). I need to say something like, "does the class 'yes' exist in , if so, for Next, do what you normally do, if not, go to image 1, or for Previous, if you are at position 1 go to the next available image under position 8.

    Hopefully that's made sense to somebody ;-) Any assistance with this would be very much 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