drupal ShowCase на views_slideshow
in

Можно сделать галерею с просмотром

1. Ставим модуль views_slideshow

2. Создаем Представление (View) в котором выводим 4 картинки прикрепленные attach или imagefield к соответствующим материалам.

3. Настраиваем views_slideshow для работы с нашим видом

4. Форматируем графическое представление при помощи стилей

/* Showcase settings  */

/* width of Gallery ShowCase block Fix fo IE*/
#block-views-GalleryMini-block_1
{
width:225px;
}

/* width of Gallery ShowCase block Fix for IE*/
.view-GalleryMini
{
width:210px;
}

/* Preview images size (1/2 for 2 columns layout) and paddings*/
.views_slideshow_singleframe_pager div a img {
width: 90px;
height: 90px;
padding-left:5px;
padding-bottom:5px;
}
/*show preview image divs in line*/
.views_slideshow_singleframe_pager div {
display:inline;
padding-left:0px;
}
/*default preview images border (For example: same as background color)*/
.views_slideshow_singleframe_pager.thumbnails a img {
border: 1px solid #CAE5C6;
}
/*hover preview images border (For example: same as background color)*/
.views_slideshow_singleframe_pager.thumbnails a.activeSlide img {
border: 1px solid #fff;
}
/*Active pager number style*/
.views_slideshow_singleframe_pager.numbered a.activeSlide {
text-decoration: underline;
}

5. Для перехода на материалы содержащие картинки при клике на превьюшки

необходимо подправить javascipt файл -

<DRUPAL>/modules/views_slideshow/contrib/views_slideshow_singleframe/views_slideshow.js

Заменить фрагмент формирующий ссылки превью (в pager-е)

...

if (settings.pager_type == 1) {
return '<div class="' + classes + '"><a href="#"><img src="' + $(slide).find('img').attr('src') + '" /></a></div>';
}
else

...

НА

...

if (settings.pager_type == 1) {
return '<div class="' + classes + '"><a href="' + $(slide).find('a').attr('href') +'"><img src="' + $(slide).find('img').attr('src') + '" /></a></div>';
}
else

...

 

 

0
Your rating: Нет

Можно, однако задача

Можно, однако задача slideshow в другом

Он умеет показвать и крутить картинки (из нод, директории, и т.п.)

В данном случае это функционал - показа главной 4 превьюшек + одной увеличенной при выборе или наведении.

То же можно реализовать просто на view + js, однако, так напишете тот же функционал.

А разве нельзя просто в

А разве нельзя просто в настройках views выставить, что бы картинка ссылалась на ноду?

Мне очень понравился пост.

Мне очень понравился пост. Как раз для тех кто не любит разбрасывать деньги.

Отправить комментарий

Содержание этого поля является приватным и не предназначено к показу.
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Доступны HTML теги: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <p> <br><b><i> <img>
  • Строки и параграфы переносятся автоматически.

Подробнее о форматировании

КАПЧА
Этот тест необходим защиты от спама
3 + 5 =
Решите эту простую математическую задачу и введите результат. То есть для 1+3, введите 4.
To prevent automated spam submissions leave this field empty.