OWL Carousel - танцы с бубнами

[ArtemPitov]

Доброго времени суток ! 

 

Уже как час борюсь стандартным OWL, суть какова -  нужно поменять анимацию слайдера, прочитал мануал добавил в скрипт transitionStyle : "fade" как на оф. сайте в демке, не помогла, анимация не меняется, в чем может быть проблема  ?  Спасибо !

 

[aridius]

Вы побывали другой вариант прописывать?

 

"fade", "backSlide", goDown and scaleUp.

[ArtemPitov]

пробовал, такая же не работает

[aridius]

owl.transitions.css

 

у вас он есть ,вы его подключили?

[ArtemPitov]

он есть, в самом контролере он не подключен, подключил $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.transitions.css'); , не помогло

[AlexPain]

Но после указания типа анимации, многие сталкиваются с тем, что слайдер вообще перестает работать, либо изображения сменяются без какого-либо эффекта. Дело в том, что в текущей версии Opencart и OcStore не подключены все стили слайдера, и есть небольшой баг в скрипте слайдера.

Первым делом надо подключить стили анимаций слайдера. Это делается в файлах /catalog/controller/module/slideshow.php и /catalog/controller/module/carousel.php соответственно. Здесь надо дописать строчку

        $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.transitions.css');

после 

        $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.carousel.css');

Также в строке  $this->document->addScript('catalog/view/javascript/jquery/owl-carousel/owl.carousel.min.js');  удаляем слово "min", так как следующим шагом будет редактирование и подключение файла полного скрипта слайдера. Получаем в итоге три строки такого вида:

        $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.carousel.css');
        $this->document->addScript('catalog/view/javascript/jquery/owl-carousel/owl.carousel.js');
        $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.transitions.css');

Сохраняем файл и идем в папку /catalog/view/javascript/jquery/owl-carousel где открываем файл owl.carousel.js, в котором ищем строку:

support3d = (asSupport !== null && asSupport.length === 1);

и меняем ее на:

support3d = (asSupport !== null && asSupport.length >= 1 && asSupport.length <= 2);

Эта строка отвечает за поддержку слайдера различными браузерами, в том числе и Internet Explorer. В измененной версии поддержка будет более точной, поэтому слайдер сможет использовать все свои эффекты в современных браузерах. Сохраняем отредактированный файл, чистим кэш браузера (Ctrl+F5 или Ctrl+Shift+R) и радуемся новым эффектам слайдера. В документации говорится, что можно написать и свои эффекты для слайдера, поэтому тут можно и еще поэксперементировать.