views_slideshow контролирует модификацию Drupal 7 - PullRequest
Новая
       18

views_slideshow контролирует модификацию Drupal 7

2 голосов
/ 02 апреля 2012

Я использую views_slideshow на Drupal 7. Я настроил его так, что он настроен на отображение нижних элементов управления вместо верхних элементов управления.

Я попытался заменить «следующий» и «предыдущий» текст изображением, которое я успешно выполнил по большей части.Проблема в том, что изображения не кликабельны.Позвольте мне объяснить больше.У меня есть этот код CSS: 

.views-slideshow-controls-bottom {
margin-left: 500px;
background-image: url(../images/links-bg.gif);
background-repeat: no-repeat;
width: 107px;
height: 57px;
}
.views-slideshow-controls-text-previous {
background-image: url(../images/prev-link-hover.gif);
display: inline-block;
width: 36px;
height: 35px;
margin-left: 15px;
margin-top: 10px;
}
.views-slideshow-controls-text-previous a {
display: none;
}
.views-slideshow-controls-text-next {
background-image: url(../images/next-link-hover.gif);
display: inline-block;
height: 35px;
width: 36px;
}
.views-slideshow-controls-text-next a {
display: none;
}

Это выглядит великолепно, перемещает его вправо (через margin left 500px), применяет общий фон, а затем применяет соответствующее изображение к следующему и предыдущему.Все работаетОднако следующее и предыдущее изображения при нажатии не заставляют слайд-шоу переходить к следующему и предыдущему слайду.Поэтому я решил посмотреть, возможно, это были наценки.И я все это проверил и нашел что-то интересное.Когда я вынимаю margin-left: 500px; из .views-slideshow-controls-bottom, это работает, когда я нажимаю на следующее и предыдущее изображения, после того, как это было удалено, оно работает.Поэтому я попробовал другой запас.Я применил margin-top:500px;, и это сработало.Просто кажется margin-left.

Ссылка: http://www.completegroupuk.com (слайд-шоу на главной странице)

Почему это происходит?Как я могу это исправить?

1 Ответ

3 голосов
/ 02 апреля 2012

Хорошо, вот как я заставил это работать.Добавьте положение относительно div .view-slideshow, удалите поле left-left из .views-slideshow-controls-bottom и расположите элементы навигации с высоким z-индексом. 

.view-slideshow { position: relative; }

.views-slideshow-controls-bottom {
  background-image: url(../images/links-bg.gif);
  background-repeat: no-repeat;
  width: 107px;
  height: 57px;
  position: absolute;
  top: 230px;
  right: 355px;
  z-index: 500;
}
...