Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2008
  • Last Modified:

JQuery LightBox - How do you get prev, next buttons functionality??? http://leandrovieira.com/projects/jquery/lightbox/

http://leandrovieira.com/projects/jquery/lightbox/

How do you get the previous, next buttons to appear with gallery photos?
That is, how do you relate all the photos so the lightbox knows they are all contained in the gallery??

I cannot figure this out for the life of me.

My code is below - it opens the lightbox but does not show navigation buttons.
See http://bestof.apexhost.net.au/nsw/accomm.aspx - click on the photos links in the blue summary area to open lightbox - note how no navigation is opened.

Any help appreciated.
$("ul.photos a").each(function()
        {
            $(this).lightBox({
                fixedNavigation: true,
                overlayBgColor: '#000000',
                overlayOpacity: 0.8,
                imageLoading: '/images/lightbox/loading.gif',
                imageBtnClose: '/images/lightbox/closelabel.gif',
                imageBtnPrev: '/images/lightbox/prevlabel.gif',
                imageBtnNext: '/images/lightbox/nextlabel.gif',
                containerResizeSpeed: 350,
                txtImage: 'Photo',
                txtOf: 'of'
            });
        });

Open in new window

0
smacca
Asked:
smacca
1 Solution
 
Albert Van HalenCommented:
You have to use the collection of elements to bind to the lightbox.
Not the individual items within the collection.

Use this
$("ul.photos a").lightBox({
    fixedNavigation: true,
    overlayBgColor: '#000000',
    overlayOpacity: 0.8,
    imageLoading: '/images/lightbox/loading.gif',
    imageBtnClose: '/images/lightbox/closelabel.gif',
    imageBtnPrev: '/images/lightbox/prevlabel.gif',
    imageBtnNext: '/images/lightbox/nextlabel.gif',
    containerResizeSpeed: 350,
    txtImage: 'Photo',
    txtOf: 'of'
});

Open in new window

0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now