LightBox Следующая кнопка всегда включена? - PullRequest
Новая
       11

LightBox Следующая кнопка всегда включена?

1 голос
/ 29 ноября 2009

В LightBox, есть ли способ всегда показывать навигационную кнопку Далее?

Ответы [ 2 ]

2 голосов
/ 14 ноября 2012

Кажется, каждый клиент, которого я люблю, любит лайтбокс, но жалуется на то, что ему «приходится» закрывать каждое большое изображение, чтобы они могли щелкнуть на следующем миниатюре. Они никогда не осознают, что могут навести курсор мыши на большое изображение, чтобы увидеть стрелки навигации и сразу же перейти к следующему изображению. Вот мое решение (с использованием Lightbox 2.51):

В "lightbox.css" измените это: 

.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;
}

до 

.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 */
}

Надеюсь, это поможет кому-то там. Приветствия.

1 голос
/ 29 ноября 2009

Я предполагаю, что вы используете Лайтбокс 2

Откройте файл lightbox.css и измените эти две строки: 

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

до 

#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;}

Я проверял это только в Safari, но во всем остальном все должно быть в порядке. Знаменитые последние слова, а?

...