Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.07.2018, 13:00
Аватар для kvizor34
Аспирант
Отправить личное сообщение для kvizor34 Посмотреть профиль Найти все сообщения от kvizor34
 
Регистрация: 08.02.2018
Сообщений: 50

Отловить событие resize для одного значения
Здравствуйте уважаемый форумчане!
Задача состоит в том чтобы выполнить некую функцию тогда и только тогда когда событие window.resize прошло порог в 1440px (туда или обратно). Логично было написать такую штуку:
$(window).resize(function () {
        if($(window).width()===1440){
            //my actions
        }
    })

Но, как оказалось, ресайз может оказаться весьма резким, и нужное мне значение просто будет пропущено.

З.Ы.
Я знаю что этот пост будут читать "особо умные" пользователи, которым непременно расскажи "всю суть задачи, и вообще я не понимаю зачем такое реализовывать", поэтому немного объясню.
Есть самописная карусель, которая в адаптивной версии сайта требует перезагрузки страницы, для того чтобы загрузиться ещё раз, с новыми значениями, и адекватно работать дальше. Точно так-же при переходе из "адаптивной" версии в "десктопную" нужна перезагрузка страницы. Порог "адаптива" состовляет как раз 1440px. И я хочу при его прохождении обновлять дом-узел с каруселькой.
Ответить с цитированием
  #2 (permalink)  
Старый 26.07.2018, 13:46
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

<div id="result"></div>
<div id="current"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
var oldDelta = $(window).width() - 1440, oldSign = oldDelta / (Math.abs(oldDelta)|| 1), newDelta, newSign;
$(window).resize(function () {
        newDelta = $(window).width() - 1440, newSign = newDelta / (Math.abs(newDelta)||1);
        current.textContent = newDelta;
        if(oldSign != newSign){
            result.innerHTML += ((oldSign < 0)?"Bigger":"Less") + "<br>";
            oldSign = newSign;
        }
    })
</script>
Ответить с цитированием
  #3 (permalink)  
Старый 26.07.2018, 13:57
Аватар для SuperZen
Профессор
Отправить личное сообщение для SuperZen Посмотреть профиль Найти все сообщения от SuperZen
 
Регистрация: 08.11.2017
Сообщений: 607

@mediaquery проще ) https://www.w3schools.com/css/tryit....eries_fontsize

тогда обе разметки должны быть на странице, просто при одном размере показываем одну, при другом другую. или смиксовать что-то среднее )
Ответить с цитированием
  #4 (permalink)  
Старый 26.07.2018, 14:05
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

Вы чего ребята ? есть событие для этого
window.matchMedia('(min-width: 1440px)').addListener(e=>console.log('отметка пройдена'));
Ответить с цитированием
  #5 (permalink)  
Старый 26.07.2018, 14:28
Аватар для kvizor34
Аспирант
Отправить личное сообщение для kvizor34 Посмотреть профиль Найти все сообщения от kvizor34
 
Регистрация: 08.02.2018
Сообщений: 50

Сообщение от Dilettante_Pro Посмотреть сообщение
<div id="result"></div>
<div id="current"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
var oldDelta = $(window).width() - 1440, oldSign = oldDelta / (Math.abs(oldDelta)|| 1), newDelta, newSign;
$(window).resize(function () {
        newDelta = $(window).width() - 1440, newSign = newDelta / (Math.abs(newDelta)||1);
        current.textContent = newDelta;
        if(oldSign != newSign){
            result.innerHTML += ((oldSign < 0)?"Bigger":"Less") + "<br>";
            oldSign = newSign;
        }
    })
</script>
Сложный вариант, но попробую если остальные не подойдут, спасибо.

Сообщение от SuperZen Посмотреть сообщение
@mediaquery проще ) https://www.w3schools.com/css/tryit....eries_fontsize

тогда обе разметки должны быть на странице, просто при одном размере показываем одну, при другом другую. или смиксовать что-то среднее )
Два одинаковых слайдера на странице, как вариант, но я не буду так засирать DOM.

Сообщение от j0hnik Посмотреть сообщение
Вы чего ребята ? есть событие для этого
window.matchMedia('(min-width: 1440px)').addListener(e=>console.log('отметка пройдена'));
Вот это варик) сейчас испробую, спасибо.
Ответить с цитированием
  #6 (permalink)  
Старый 26.07.2018, 14:31
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

только вот так укажите
max-width: 1440px
Ответить с цитированием
  #7 (permalink)  
Старый 26.07.2018, 14:49
Аватар для SuperZen
Профессор
Отправить личное сообщение для SuperZen Посмотреть профиль Найти все сообщения от SuperZen
 
Регистрация: 08.11.2017
Сообщений: 607

Сообщение от kvizor34 Посмотреть сообщение
Сложный вариант, но попробую если остальные не подойдут, спасибо.


Два одинаковых слайдера на странице, как вариант, но я не буду так засирать DOM.


Вот это варик) сейчас испробую, спасибо.
а делать перезагрузку страницы, это выход...)

можно одни и те же блоки использовать...
Ответить с цитированием
  #8 (permalink)  
Старый 26.07.2018, 14:53
Аватар для kvizor34
Аспирант
Отправить личное сообщение для kvizor34 Посмотреть профиль Найти все сообщения от kvizor34
 
Регистрация: 08.02.2018
Сообщений: 50

Сообщение от j0hnik Посмотреть сообщение
только вот так укажите
max-width: 1440px
Спасибо Джоник!) ты меня уже 4й раз выручаешь))
Вопрос решён. Тема закрыта.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Написать программу для вычисления значения выражения: vanya_xa Общие вопросы Javascript 1 17.02.2018 19:46
Отменить событие для ячейки таблицы kot_k_k jQuery 4 19.02.2016 12:46
событие schange для select, когда нет изменения FeelUs Events/DOM/Window 3 08.02.2016 05:09
Выполнение javascript для одного div bengalsky AJAX и COMET 7 06.05.2015 12:45
Как отловить событие onchange на LookUp поле? spps Events/DOM/Window 0 09.09.2008 15:02