2

Здравствуйте.

Есть определённая проблема с отображением аккордеона при переходе из десктопной в мобильную версию, однако при перезагрузке страницы эта проблема решается. Собственно вопрос в том как сделать так что бы при помощи js или jquery, при становлении страницы шириной в 670px страница обновлялась. Или если есть какой то более грамотный способ решения этой проблемы я был бы только рад если вы поможете.

Благодарю за ваше потраченное на меня время.

		
 $( function() {
    var icons = {
      header: "up",
      activeHeader: "down"
    };
    $( "#accordion" ).accordion({
      icons: icons,
      collapsible: true
    });
    $( "#toggle" ).button().on( "click", function() {
      if ( $( "#accordion" ).accordion( "option", "icons" ) ) {
        $( "#accordion" ).accordion( "option", "icons", null );
      } else {
        $( "#accordion" ).accordion( "option", "icons", icons );
      }
    });
  } );

4
  • css media queries.
    – zb'
    Commented 26 мар. 2017 в 5:24
  • Если именно перезагрузка помогает (стоит пересмотреть архитектуру и сделать нормально) - событие resize. Иначе - media queries.
    – user207618
    Commented 26 мар. 2017 в 5:43
  • Зачем себе проблемы на ровном месте выдумывать? Пользователь не будет переходить с десктопной версии на мобильную, он зайдет либо с десктопа, либо с мобильного и никакая перезагрузка не нужна
    – user212578
    Commented 26 мар. 2017 в 8:19
  • Да я тоже думаю что пользователь не будет переходить с десктопной на мобильную, но это требование учителя - решить этот баг.
    – Kamel515
    Commented 26 мар. 2017 в 12:05

2 ответа 2

0

if(window.matchMedia("only screen and (max-device-width: 670px)")){
window.location.reload(true);
}

Может так?

3
  • а как и куда это можно вставить?
    – Kamel515
    Commented 26 мар. 2017 в 12:03
  • @Kamel515 Пишешь в CSS такой медиа запрос и просто вставляешь этот код в любое место (желательно в конце).
    – Eugen Eray
    Commented 26 мар. 2017 в 12:06
  • к сожалению оно начинает эпилептично обновляться каждую секунду
    – Kamel515
    Commented 26 мар. 2017 в 12:15
0

Можно повесить слушателя на изменение размеров окна:

window.addEventListener("resize", setScreenSize);

setScreenSize(event){
  var width = window.innerWidth; //ширина окна
  var height = window.innerHeight; //высота окна
  // весь код, который вы здесь напишите, будет выполняться каждый раз,
  // как будет изменяться размер окна.
}

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.