Маленькая шабашка для знатока JS

[gluck]

На сайте стоит вот такой свайпер: http://www.idangero.us/sliders/swiper/api.php

Все прекрасно работает (вариант без API).

 

Нужно повторить такой же свайпер еще раз на той же самой странице. Картинки другие, размеры другие (это я сам осилю), функционал тот же самый. На php  это не решить, нужно знать JS.

 

Сделаем?

[Kerm]

Можно на этом сайте посмотреть _bikinimal.ru там на карточке товара я до 4х слайдеров на этом скрипте вывел

[gluck]

А толку смотреть итоговую страницу? Там уже чистый результат выведен... 

Сделаете мне второй свайпер за вразумительную денежку?

[Kerm]

Да чего его там делать то? 

[Kerm]

<script type="text/javascript">
		      var mySwiper = new Swiper('.swiper-container', {
		      	loop: false,
		      	slidesPerView: 4
		      })
		       $('.arrow-left').on('click', function(e) {
		      	e.preventDefault()
		      	mySwiper.swipePrev()
		      })
		       $('.arrow-right').on('click', function(e) {
		      	e.preventDefault()
		      	mySwiper.swipeNext()
		      })
</script>

<script type="text/javascript">
		      var mySwiper1 = new Swiper('.swiper-container1', {
		      	loop: false,
		      	slidesPerView: 4
		      })
		       $('.arrow-left1').on('click', function(e) {
		      	e.preventDefault()
		      	mySwiper1.swipePrev()
		      })
		       $('.arrow-right1').on('click', function(e) {
		      	e.preventDefault()
		      	mySwiper1.swipeNext()
		      })
</script>

Ну и так далее, модуль слайдера копируешь по аналогии прибавляя цифры на конце с умом, в css так же прописываешь прибавляя цифры с умом.

 

Тут вообще делать не чего, все очень просто.

Edited December 9, 2013 by Kerm (see edit history)

[gluck]

Если б знал, не просил бы

 

У меня в html все выглядит как у вас, но событие "потянул за картинку" обрабатывается только на первом свайпере. Я уже пробовал по-разному обзывать дивы, добавлять их новые имена в инициализацию js, но все мимо Подозреваю, что дело в одной строкае, но какой и где — для такого валенка как я сие тайна есть

[gluck]

О, мерси, счас попробую ваш вариант.

swiper-container1 я уже делал, но наверное не так или не там

[gluck]

Спасибо, заработало только в таком виде:

<script type="text/javascript">
window.onload = function() {
var mySwiper = new Swiper('.swiper-container', {
		      	loop: true,
		      	slidesPerView: 4
		      })
var mySwiper = new Swiper('.swiper-container1', {
		      	loop: true,
		      	slidesPerView: 4
		      })
		       $('.arrow-left').on('click', function(e) {
		      	e.preventDefault()
		      	mySwiper.swipePrev()
		      })
		       $('.arrow-right').on('click', function(e) {
		      	e.preventDefault()
		      	mySwiper.swipeNext()
		      })}
</script>

В вашем варианте ни в какую не хочет.