Автор Тема: Прокрутка изображений товара, как настроить?  (Прочитано 443 раз)

08 Сентябрь 2014, 10:33:28
  • Старожил
  • ****
  • Сообщений: 299
  • Репутация: +0/-0
  • Новичек
    • Просмотр профиля
Добрый день.

Подскажите пожалуйста в таком вопросе: при добавлении нескольких фотографий для товара(в редакторе товара) на странице товара на сайте под основной фотографией товара появляется полоса прокрутки остальных его изображений. При нажатии на стрелки можно листать фотографии вправо/влево, но когда доходит до последней, то опять фотографии идут по кругу. Можно ли сделать так, чтобы они не шли по кругу, когда человек дошел до последней фотографии?   Подскажите, может кто знает.
08 Сентябрь 2014, 11:03:08
Ответ #1
  • Ветеран
  • *****
  • Сообщений: 1047
  • Репутация: +3/-0
  • Сообщество PrestaShop
    • Просмотр профиля
В файле /themes/default-bootstrap/js/product.js
$('#thumbs_list').serialScroll({
        .....
        cycle:false
        /*cycle - if true, the first element will be shown after going over the last, and the other way around.*/
08 Сентябрь 2014, 11:16:39
Ответ #2
  • Старожил
  • ****
  • Сообщений: 299
  • Репутация: +0/-0
  • Новичек
    • Просмотр профиля
Открыл файл product.js, глянул  - там по кругу стоит false, но картинки все-равно прокручиваются опять сначала...
//init the serialScroll for thumbs
$('#thumbs_list').serialScroll({
items:'li:visible',
prev:'#view_scroll_left',
next:'#view_scroll_right',
axis:'x',
offset:0,
start:0,
stop:true,
onBefore:serialScrollFixLock,
duration:700,
step: 2,
lazy: true,
lock: false,
force:false,
[b]cycle:false[/b]
});
Попробовал изменить на true - тоже самое. Как быть?
08 Сентябрь 2014, 11:20:46
Ответ #3
  • Модератор
  • Ветеран
  • *****
  • Сообщений: 86543
  • Репутация: +25419/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Смотреть шаблон и js функции вашей темы.
08 Сентябрь 2014, 11:23:46
Ответ #4
  • Старожил
  • ****
  • Сообщений: 299
  • Репутация: +0/-0
  • Новичек
    • Просмотр профиля
Подскажите, в каком файле искать шаблон функции?
08 Сентябрь 2014, 11:25:30
Ответ #5
  • Модератор
  • Ветеран
  • *****
  • Сообщений: 86543
  • Репутация: +25419/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Все находиться в папке /themes/называние вашей темы.
Название файлов см. выше.
08 Сентябрь 2014, 11:30:47
Ответ #6
  • Старожил
  • ****
  • Сообщений: 299
  • Репутация: +0/-0
  • Новичек
    • Просмотр профиля
08 Сентябрь 2014, 11:45:30
Ответ #7
  • Старожил
  • ****
  • Сообщений: 299
  • Репутация: +0/-0
  • Новичек
    • Просмотр профиля
В файле product.js на шел две функции,которые могут отвечать за serialScroll for thumbs (я не совсем уверен, потому что пока не сильно разбираюсь в этом):
Первая ф-я:
function serialScrollFixLock(event, targeted, scrolled, items, position)
{
serialScrollNbImages = $('#thumbs_list li:visible').length;
serialScrollNbImagesDisplayed = 3;

var leftArrow = position == 0 ? true : false;
var rightArrow = position + serialScrollNbImagesDisplayed >= serialScrollNbImages ? true : false;

$('#view_scroll_left').css('cursor', leftArrow ? 'default' : 'pointer').css('display', leftArrow ? 'none' : 'block').fadeTo(0, leftArrow ? 0 : 1);
$('#view_scroll_right').css('cursor', rightArrow ? 'default' : 'pointer').fadeTo(0, rightArrow ? 0 : 1).css('display', rightArrow ? 'none' : 'block');
return true;
}
Вторая ф-я:
// Change the current product images regarding the combination selected
function refreshProductImages(id_product_attribute)
{
$('#thumbs_list_frame').scrollTo('li:eq(0)', 700, {axis:'x'});

id_product_attribute = parseInt(id_product_attribute);

if (id_product_attribute > 0 && typeof(combinationImages) != 'undefined' && typeof(combinationImages[id_product_attribute]) != 'undefined')
{
$('#thumbs_list li').hide();
$('#thumbs_list').trigger('goto', 0);
for (var i = 0; i < combinationImages[id_product_attribute].length; i++)
if (typeof(jqZoomEnabled) != 'undefined' && jqZoomEnabled)
$('#thumbnail_' + parseInt(combinationImages[id_product_attribute][i])).show().children('a.shown').trigger('click');
else
$('#thumbnail_' + parseInt(combinationImages[id_product_attribute][i])).show();
}
else
$('#thumbs_list li').show();

if (parseInt($('#thumbs_list_frame >li:visible').length) != parseInt($('#thumbs_list_frame >li').length))
$('#wrapResetImages').stop(true, true).show();
else
$('#wrapResetImages').stop(true, true).hide();

var thumb_width = $('#thumbs_list_frame >li').width() + parseInt($('#thumbs_list_frame >li').css('marginRight'));
$('#thumbs_list_frame').width((parseInt((thumb_width) * $('#thumbs_list_frame >li').length)) + 'px');
$('#thumbs_list').trigger('goto', 0);
serialScrollFixLock('', '', '', '', 0);// SerialScroll Bug on goto 0 ?
}
Подскажите пожалуйста, если это те функции, где мне нужно изменить то, что мне нужно?
08 Сентябрь 2014, 12:09:17
Ответ #8
  • Ветеран
  • *****
  • Сообщений: 1047
  • Репутация: +3/-0
  • Сообщество PrestaShop
    • Просмотр профиля
В этих функциях ничего не нужно менять. Инициализация происходит в
//init the serialScroll for thumbs
$('#thumbs_list').serialScroll({
...
Здесь задаются параметры скролинга.
Если у вас не работает изменение этих параметров, значит где-то есть дублирующие функции.
Открывайте сайт в firefox или chrome, запускайте профилирование. Так сможете определить причину.
Как работать с консолью отладки писали не раз. Не сможете найти на форуме, yandex подстажет.
08 Сентябрь 2014, 12:18:57
Ответ #9
  • Старожил
  • ****
  • Сообщений: 299
  • Репутация: +0/-0
  • Новичек
    • Просмотр профиля
Понял. Спасибо за совет и помощь.