Fancybox 3 Modal, проблема с прокруткой на старых телефонах - PullRequest
0 голосов
/ 11 января 2019

У меня есть анимированный модал fancybox 3 с длинным телом. Существует проблема с прокруткой на мобильных телефонах, но только старые, iphone 6s или galaxy s8 работают нормально. Он захватывает все фантазии и отталкивает, а не прокручивает содержимое тела. Я пытался добавить переполнение: прокрутка, фиксированное положение, но это не помогает. Когда я нахожусь в инспекторе, с включенным мобильным режимом, я могу прокручивать его с помощью колесика мыши, при попытке «прикоснуться» к нему и прокрутить, модальный режим отключен.

CodePen показывает, что происходит :( https://codepen.io/anon/pen/MZPPYd

Редактировать: В codepen все работает, НО Когда я вхожу в codepen, fancybox добавляет класс fancybox-is-grabbing В моем проекте он добавляет контроллеры fancybox - isGrabbing

Это может быть проблемой, но почему он это делает?

Что делать? Есть ли возможность заставить его работать?

Ниже структура моего кода.

<div style="display: none;" id="animatedModal3" class="animated-modal modalLists">
 <div class="leftPhoto tabsListConfigurator side">
  <div class="tabsWrap">
   <div class="sectionTitle">Kolory</div>
    <ul class="tabsCon">
     <li class="tab-link current" data-tab="tab-1a">
      <img src="3.jpg" alt="">
      <span class="product">Drewno</span>
     </li>
     <li class="tab-link current" data-tab="tab-1a">
      <img src="3.jpg" alt="">
      <span class="product">Drewno</span>
     </li>
     <li class="tab-link current" data-tab="tab-1a">
       <img src="3.jpg" alt="">
       <span class="product">Drewno</span>
     </li>
     (a lot li here)
    </ul>
   </div>
  </div>
 </div>
</div>

.animated-modal{
width:80%;
overflow:hidden;
position:fixed;
}
.tabsListConfigurator{
max-height:500px;
overflow:auto;
overflow-scrolling:auto;
}
.tabsWrap{
position:relative;
overflow-y:scroll;
}
...