Merhaba
Opencart ile hazırladığımız sitede anasayfadaki slider mobilde el ile değiştiremiyoruz.
Site
Linki
Kodları ekliyorum.
Yardımcı olacak arkadaşlara şimdiden teşekkür ediyorum.
Kodlar:
<div class="brand-slider">
<div class="owl-container">
<div id="banner{{ module }}" class="owl-carousel owl-theme">
{% for banner in banners %}
<div class="item">{% 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>
<script >
$(document).ready(function() {
$("#banner{{ module }}").owlCarousel({
mouseDrag: true,
touchDrag: true,
pullDrag: true,
autoplaySpeed: 1000,
navSpeed: 1000,
dotsSpeed:1000,
items : 5,
autoplay : false,
nav: true,
dots: false,
autoplayHoverPause : false,
margin: 0,
responsive:{
0:{
items:2,
nav: false
},
480:{
items: 3,
nav: false
},
768:{
items: 4
},
992:{
items: 4
},
1200:{
items: 5
},
},
onInitialized: function() {
owlAction();
},
onTranslated: function() {
owlAction();
}
});
function owlAction() {
$(".owl-featured-categories .owl-item").removeClass('first');
$(".owl-featured-categories .owl-item").removeClass('last');
$(".owl-featured-categories .owl-item").removeClass('before-active');
$(".owl-featured-categories .owl-item.active:first").addClass('first');
$(".owl-featured-categories .owl-item.active:last").addClass('last');
$('.owl-featured-categories .owl-item.active:first').prev().addClass('before-active');
}
});
</script>