Блог

Главная - Вопросы по программированию - Как правильно задать условие, при котором будет работать слайдер?

Как правильно задать условие, при котором будет работать слайдер?

#javascript #html

Вопрос:

пожалуйста, скажите мне, как правильно написать условие? Мне нужно, чтобы, если экран монитора составляет 768 пикселей, то это условие было запущено для слайдера:

 document.querySelector('.slider__next').addEventListener('click', function() {
    offset = offset   304;
    if (offset > 608) {
        offset = 0;
    }
    sliderLine.style.left = -offset   'px';
});
document.querySelector('.slider__prev').addEventListener('click', function() {
    offset = offset - 304;
    if (offset < 0) {
        offset = 608;
    }
    sliderLine.style.left = -offset   'px';
});

и если экран монитора составляет 320 пикселей, то это условие было вызвано для слайдера:

 document.querySelector('.slider__next').addEventListener('click', function() {
    offset = offset   304;
    if (offset > 912) {
        offset = 0;
    }
    sliderLine.style.left = -offset   'px';
});
document.querySelector('.slider__prev').addEventListener('click', function() {
    offset = offset - 304;
    if (offset < 0) {
        offset = 912;
    }
    sliderLine.style.left = -offset   'px';
});

Я пытаюсь это сделать, но по какой-то причине это неправильно работает с экраном 320 пикселей. код работает под экраном с разрешением 768 пикселей:

 if (window.innerWidth == 768) {
    document.querySelector('.slider__next').addEventListener('click', function() {
        offset = offset   304;
        if (offset > 608) {
            offset = 0;
        }
        sliderLine.style.left = -offset   'px';
    });
    document.querySelector('.slider__prev').addEventListener('click', function() {
        offset = offset - 304;
        if (offset < 0) {
            offset = 608;
        }
        sliderLine.style.left = -offset   'px';
    });
} else if (window.innerWidth == 320) {
    document.querySelector('.slider__next').addEventListener('click', function() {
        offset = offset   304;
        if (offset > 912) {
            offset = 0;
        }
        sliderLine.style.left = -offset   'px';
    });
    document.querySelector('.slider__prev').addEventListener('click', function() {
        offset = offset - 304;
        if (offset < 0) {
            offset = 912;
        }
        sliderLine.style.left = -offset   'px';
    });
}

Комментарии:

1. Что вы имеете в виду под » работает неправильно «? Пожалуйста, будьте более конкретны…

2. это означает, что когда я нажимаю кнопку прокрутки слайдов на экране размером 320 пикселей, они прокручиваются по одному за раз, и когда отображается последний слайд, слайды возвращаются к началу. и при переходе на экран 768 пикселей слайды прокручиваются до последнего отображается пробел. то есть условие кода для экрана 768 не срабатывает.

Метки: ,