LightBox Next button always on setting?

Question

In LightBox, is there a way to always show the navigation Next button?

Answer 1

I'm assuming you're using Lightbox 2

Open your lightbox.css file and change these two lines:

#prevLink { left: 0; float: left; }
#nextLink { right: 0; float: right; }

to

#prevLink { left: 0; float: left; background: url(../images/prevlabel.gif) left 15% no-repeat;}
#nextLink { right: 0; float: right; background: url(../images/nextlabel.gif) right 15% no-repeat;}

I've only tested this in Safari but it should be OK in everything else. Famous last words eh?

Answer 2

Seems every customer I have loves Lightbox but complains about "having to" close each large image so they can click on the next thumbnail. They never realize that they can mouseover the big image to see nav arrows and click to the next image immediately. Here's my solution (using Lightbox 2.51):

In "lightbox.css" change this:

.lb-prev, .lb-next {
  width: 49%;
  height: 100%;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
  /* Trick IE into showing hover */
  display: block;
}

/* line 72, ../sass/lightbox.sass */
.lb-prev {
  left: 0;
  float: left;
}

/* line 76, ../sass/lightbox.sass */
.lb-next {
  right: 0;
  float: right;
}

/* line 81, ../sass/lightbox.sass */
.lb-prev:hover {
  background: url(../images/prev.png) left 48% no-repeat;
}

/* line 85, ../sass/lightbox.sass */
.lb-next:hover {
  background: url(../images/next.png) right 48% no-repeat;
}

to:

.lb-prev, .lb-next {
  width: 49%;
  height: 100%;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
  /* Trick IE into showing hover */
  display: block;
  opacity:0.6;
  filter:alpha(opacity=60); /* For IE8 and earlier */
}

/* line 72, ../sass/lightbox.sass */
.lb-prev {
  left: 0;
  float: left;
  background: url(../images/prev.png) left 48% no-repeat;
}

/* line 76, ../sass/lightbox.sass */
.lb-next {
  right: 0;
  float: right;
  background: url(../images/next.png) right 48% no-repeat;
}

/* line 81, ../sass/lightbox.sass */
.lb-prev:hover {
  opacity:1.0;
  filter:alpha(opacity=100); /* For IE8 and earlier */
}

/* line 85, ../sass/lightbox.sass */
.lb-next:hover {
  opacity:1.0;
  filter:alpha(opacity=100); /* For IE8 and earlier */
}

Hope this helps someone out there. Cheers.