Question

Using the jQuery plugin http://jquery.com/plugins/project/jquerylightbox_bal

Is there a way to have the title and NEXt/PREVIOUS buttons always appear. Currently we have to hover to have these appear and my users mostly aren’t noticing that.

LightBox2 and others allow this but I need it based on jQuery as the other frameworks interfere with my other js.

It’s for this web site: http://BiblePro.BibleOcean.com

Answer 1

It is not currently possible as an option, however you can modify the lightbox js file with the following changes:

        // Prev
        $('#lightbox-nav-btnPrev').unbind().hover(function() { // over
            $(this).css({ 'background' : 'url(' + $.Lightbox.files.images.prev + ') left 45% no-repeat' });
        },function() { // out
            $(this).css({ 'background' : 'transparent url(' + $.Lightbox.files.images.blank + ') no-repeat' });
        }).click(function() {
            $.Lightbox.showImage($.Lightbox.images.prev());
            return false;
        });

to:

        // Prev
        $('#lightbox-nav-btnPrev').css({ 'background' : 'url(' + $.Lightbox.files.images.prev + ') left 45% no-repeat' });

and the same for the next a few lines below.

Later on you will find:

                // If not first, show previous button
                if ( !this.images.first(image) ) {
                    // Not first, show button
                    $('#lightbox-nav-btnPrev').show();
                }

                // If not last, show next button
                if ( !this.images.last(image) ) {
                    // Not first, show button
                    $('#lightbox-nav-btnNext').show();
                }

Change that to:

                // If not first, show previous button
                if ( !this.images.first(image) && !this.images.last(image) ) {
                    // Not first, show button
                    $('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').show();
                }

And that should do it for you. You can either include the unminified js file in your html, or minify that js file and save that (I use the YUI js compressor).

I will consider making it an option for a future release.