Центрирующий элемент на основе нажатия кнопки - PullRequest
Новая
       16

Центрирующий элемент на основе нажатия кнопки

0 голосов
/ 28 января 2019

Я пытаюсь центрировать определенный элемент на основе выбора пользователей.У меня есть несколько кнопок и сова-карусель (я использую сову-карусель 2).Сейчас мой средний элемент первый элемент в карусели.Но если пользователь нажимает на кнопку, мне нужно, чтобы карусель «повернулась» к определенному элементу и поместила этот элемент в центр карусели.

Я попытался вызвать положение совы с событием onclick, но мне не удалось.

HTML:

<button id="btnToElementOne">First Button</button>
<button id="btnToElementFive">Second Button</button>
<button id="btnToElementEight">Third Button</button>
.
.
.

    <div id="ElementOne" class="owlItem" style="background-image: url('---------');">
        <div class="owlItemHolder" style="">
    ................
        </div>
    </div>

... 

    <div id="ElementFive" class="owlItem" style="background-image: url('---------');">
        <div class="owlItemHolder" style="">
    ................
        </div>
    </div>

... 

    <div id="ElementEight" class="owlItem" style="background-image: url('---------');">
        <div class="owlItemHolder" style="">
    ................
        </div>
    </div>

Карусель: 

    $('.owl-carousel').owlCarousel({
        loop:true,
        center: true,
        margin:40,
        nav:true,
        dots: false,
        autoplay:false,
        autoplayTimeout:4000,
        animateOut: 'fadeOut',
        animateIn: 'fadeIn',
        responsive:{
                    0:{
                    items:5
                },
                600:{
                    items:5
                },
                1000:{
                    items:5
                }
            }
        });
        var owl = $('.owl-carousel');
        $(document.documentElement).keyup(function(event) {    
            if (event.keyCode == 37) { /*left key*/
                owl.trigger('prev.owl.carousel', [700]);
            } else if (event.keyCode == 39) { /*right key*/
                owl.trigger('next.owl.carousel', [700]);
            }
        });

Хотелось быкарусель, чтобы поместить в центр Элемент Один после нажатия на Первую кнопку, элемент Пять после нажатия на Вторую кнопку и так далее.

...