Остановка при наведении Slidershow / opencart3

[Sign33444]

Всем привет!

У меня возникла небольшая проблема с внесением функции остановки слайдера при наведении.

Сам слайдер: 

<div class="swiper-viewport">
  <div id="slideshow{{ module }}" class="swiper-container">
    <div class="swiper-wrapper"> {% for banner in banners %}
      <div class="swiper-slide text-center">{% if banner.link %}<a href="{{ banner.link }}"><img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" /></a>{% else %}<img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" />{% endif %}</div>
      {% endfor %} </div>
  </div>
  <div class="swiper-pager">
    <div class="swiper-button-next"></div>
    <div class="swiper-button-prev"></div>
  </div>
</div>
<script type="text/javascript"><!--
$('#slideshow{{ module }}').swiper({
	mode: 'horizontal',
	slidesPerView: 1,
	pagination: '.slideshow{{ module }}',
	paginationClickable: true,
	nextButton: '.swiper-button-next',
    prevButton: '.swiper-button-prev',
    spaceBetween: 30,
	autoplay: 4500,
    autoplayDisableOnInteraction: true,
	loop: true,
  effect: 'easeinout',
  speed: 1000,  
  }); 
--></script>

Пробывал несколько вариантов: 

stopOnHover: true

 и

<script>
$('#slideshow{{ module }}').swiper.hover(function()
  {
    $('#slideshow{{ module }}').swiper('stop');
  }, function(){
    $('#slideshow{{ module }}').swiper('start');
  });

</script>

 

Возможно я не туда вставляю этот кусок кода, или как правильно?

скажите пожалуйста!) спасибо

[Sign33444]

Получилось все сделать.

тему можно закрывать

Вот рабочий код:

<div class="swiper-viewport">
  <div id="slideshow{{ module }}" class="swiper-container">
    <div class="swiper-wrapper"> {% for banner in banners %}
      <div class="swiper-slide text-center">{% if banner.link %}<a href="{{ banner.link }}"><img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" /></a>{% else %}<img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" />{% endif %}</div>
      {% endfor %} </div>
  </div>
  <div class="swiper-pager">
    <div class="swiper-button-next"></div>
    <div class="swiper-button-prev"></div>
  </div>
</div>
<script type="text/javascript"><!--
$('#slideshow{{ module }}').swiper({
	mode: 'horizontal',
	slidesPerView: 1,
	pagination: '.slideshow{{ module }}',
	paginationClickable: true,
	nextButton: '.swiper-button-next',
    prevButton: '.swiper-button-prev',
    spaceBetween: 30,
	autoplay: 4500,
    autoplayDisableOnInteraction: true,
	loop: true,
  effect: 'EaseInOut',
  speed: 1000,  
  });
$('#slideshow{{ module }}').hover(function(){
     this.swiper.stopAutoplay();
}, function(){
     this.swiper.startAutoplay();
});  
--></script>

 

[Pavel666]

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

Вот рабочий код:

вот за это просто плюсище! все бы так делали)

[Sign33444]

34 минуты назад, Pavel666 сказал:

вот за это просто плюсище! все бы так делали)

Спасибо)