Owl-carousel на нужном разрешении

314
25 июня 2017, 17:18

Использую owl-carousel в двух секциях. В первой секции слайдер идёт на всех разрешениях. А во второй секции слайдер должен включаться только на разрешениях меньше 700px. Как это можно реализовать?

$(document).ready(function() {
  $(".owl-carousel").owlCarousel({
    loop: true,
    items: 1,
    nav: true,
    navText: "",
  });
});
<div class="review">
    <div class="wrapper">
        <div class="owl-carousel" id="owl-carousel1">
            <div class="owl-carusel__item">
                <p>Это приложение перевернуло мой мир и позволило по-новому взглянуть на привычные серые вещи! А еще я познакомился со своей будущей женой в комментариях к выложенной фотографии!</p>
                <span class="owl-carusel__item-name">Николай Петров</span>
                <span class="owl-carusel__item-descr">25 лет, водитель трамвая</span>
            </div>
            <div class="owl-carusel__item">
                <p>Это приложение перевернуло мой мир и позволило по-новому взглянуть на привычные серые вещи! А еще я познакомился со своей будущей женой в комментариях к выложенной фотографии!</p>
                <span class="owl-carusel__item-name">Тимур Бойко</span>
                <span class="owl-carusel__item-descr">43 лет, адвокат</span>
            </div>
            <div class="owl-carusel__item">
                <p>Это приложение перевернуло мой мир и позволило по-новому взглянуть на привычные серые вещи! А еще я познакомился со своей будущей женой в комментариях к выложенной фотографии!</p>
                <span class="owl-carusel__item-name">Максим Морозов</span>
                <span class="owl-carusel__item-descr">21 лет, электрик</span>
            </div>
        </div>
    </div>
</div>


<div class="prices">
    <div class="wrapper">
        <div class="owl-carousel" id="owl-carousel2">
            <div class="prices-container">
                <table class="prices-table">
                    <tr>
                        <th></th>
                        <th>база<span>1,99 usd</span></th>
                        <th>стандарт<span>3,99 usd</span><span class="prices-table__baner">хит</span></th>
                        <th>анлим<span>9,99 usd</span></th>
                    </tr>
                    <tr>
                        <td>Розовый фильтр</td>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td>Смайлики</td>
                        <td class="no"></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td>Комментарии</td>
                        <td class="no"></td>
                        <td class="no"></td>
                        <td></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</div>
Answer 1

Сделай проверку на разрешение экрана

if ($(window).width() < 700) {
    $(document).ready(function () {
        $(".owl-carousel").owlCarousel({
            loop: true,
            items: 1,
            nav: true,
            navText: "",
        });
    });
}
READ ALSO
Input date текущий день

Input date текущий день

Как сделать, чтобы в поле появлялся текущий день

418
Событие input, проверка значения

Событие input, проверка значения

Появляется тот блок с классом, которое передаётся через input

325
Заполнение input из кнопки

Заполнение input из кнопки

Гуглил ,но не нашел подходящего ответаКак заполнить inputили textarea из кнопки

341
В чем отличие __proto__ от prototype

В чем отличие __proto__ от prototype

Пытаюсь разобраться с наследованием в js и никак не могу понять для чего нужен prototype если есть __proto__Как я понял(из того материала что изучал),...

1133