owl.carousel 2.3.4 не подхватывает width баннера

[munhgauzen]

Установил owl.carousel 2.3.4 вместо устаревшей 1.3.3 . Скрипт заработал, но при этом не подтягиваются размеры ни баннера ни слайдшоу.

Например по умолчанию баннер в дефолтном слайдшоу имеет width 1140px у меня же показывает 190px. Вроде бы все подключил и тем не менее имею вот такую непонятность.

 

подключение в  slideshow.php

 

    $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');
        $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.theme.default.css');

 

 

Весь slideshow.tpl

 

 

<div id="slideshow<?php echo $module; ?>" class="owl-carousel owl-theme" style="opacity: 1;">
  <?php foreach ($banners as $banner) { ?>
  <div class="item">
    <?php if ($banner['link']) { ?>
    <a href="<?php echo $banner['link']; ?>"><img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" /></a>
    <?php } else { ?>
    <img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
    <?php } ?>
  </div>
  <?php } ?>
</div>
<script type="text/javascript"><!--
$('#slideshow<?php echo $module; ?>').owlCarousel({
    items: 6,
    autoPlay: 3000,
    singleItem: true,
    navigation: true,
    navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'],
    pagination: true
});
--></script>

 

 

[Blast]

7 минут назад, munhgauzen сказал:

Установил owl.carousel 2.3.4 вместо устаревшей 1.3.3 . Скрипт заработал, но при этом не подтягиваются размеры ни баннера ни слайдшоу.

Например по умолчанию баннер в дефолтном слайдшоу имеет width 1140px у меня же показывает 190px. Вроде бы все подключил и тем не менее имею вот такую непонятность.

 

подключение в  slideshow.php

 

    $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');
        $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.theme.default.css');

 

 

Весь slideshow.tpl

 

 

<div id="slideshow<?php echo $module; ?>" class="owl-carousel owl-theme" style="opacity: 1;">
  <?php foreach ($banners as $banner) { ?>
  <div class="item">
    <?php if ($banner['link']) { ?>
    <a href="<?php echo $banner['link']; ?>"><img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" /></a>
    <?php } else { ?>
    <img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
    <?php } ?>
  </div>
  <?php } ?>
</div>
<script type="text/javascript"><!--
$('#slideshow<?php echo $module; ?>').owlCarousel({
    items: 6,
    autoPlay: 3000,
    singleItem: true,
    navigation: true,
    navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'],
    pagination: true
});
--></script>

 

 

190*6 = 1140

[munhgauzen]

17 минут назад, Blast сказал:

190*6 = 1140

да я понимаю но при этом у меня показывает вот такую ерунду:

По логике должно быть вот так:

<div class="owl-item" style="width: 1140px;">

а показывает вот так:

<div class="owl-item active" style="width: 190px;">

 

 

Змінено 13 березня 2020 користувачем munhgauzen

[Blast]

21 минуту назад, munhgauzen сказал:

да я понимаю но при этом у меня показывает вот такую ерунду:

По логике должно быть вот так:

<div class="owl-item" style="width: 1140px;">

а показывает вот так:

<div class="owl-item active" style="width: 190px;">

 

блин, вот математика зло

поставьте items: 1,

[munhgauzen]

поставил, теперь есть один баннер все вроде бы ок, но нет cмены банеров. Просто статично висит 1-й баннер

Как будто этого нет:

autoPlay: 3000,

[munhgauzen]

все разобрался настройки имеют много различий вот для cлайдера пойдет такое:

 

<script type="text/javascript"><!--
$('#slideshow<?php echo $module; ?>').owlCarousel({
    items: 1,
autoplay:true,
    autoplayTimeout:1000,
    autoplayHoverPause:true,
    loop:true,
    transitionStyle: 'fade',
    navigation: true,
    navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'],
    pagination: true
    
});
--></script>