Отрегулируйте высоту скольжения - PullRequest
Новая
       12

Отрегулируйте высоту скольжения

0 голосов
/ 24 апреля 2020

Я пишу электронное приложение, в котором отображаются несколько таблиц. Я использовал swiper, поэтому за один раз отображается только одна таблица. Моя проблема в том, что независимо от того, какой слайд показан, есть полоса прокрутки для прокрутки до самой длинной таблицы. Судя по всему, контейнер-swiper не настраивается автоматически.

У кого-нибудь есть идеи, как это исправить?

Это HTML

   <div id="slider" class="swiper-container">
<div class="swiper-wrapper">
    <div class="swiper-slide">
        <h2 class="tableNames">Headline</h2>
        <table class="tables"> 
            <thead>        
                <tr id="kopfzeile"><th>SERIAL_NO</th><th>Status</th> 
                                   <th>Priority</th><th>Res</th>
                </tr>
            </thead>
            <tbody></tbody>
        </table>
    </div>
    <div class="swiper-slide">
        <h2 class="tableNames">Headline</h2>
        <table class="tables"> 
            <thead>        
                <tr id="kopfzeile"><th>SERIAL_NO</th><th>Status</th> 
                                   <th>Priority</th><th>Res</th></tr>
            </thead>
            <tbody></tbody>
        </table>
    </div>
    <!-- <div class="btn">
        <button id="btnFin" type="submit">Änderungen übernehmen</button>
    </div> -->
    <div class="swiper-slide">
        <h2 class="tableNames">Headline</h2>
        <table class="tables">  
            <thead>        
                <tr id="kopfzeile"><th>SERIAL_NO</th><th>Status</th> 
                                   <th>Priority</th><th>Res</th></tr>
            </thead>
            <tbody></tbody>
        </table>
    </div>
</div>

И это конфигурация swiper 

    var mySwiper = new Swiper ('.swiper-container', {
// Optional parameters
direction: 'horizontal',
loop: false,

// Navigation arrows
navigation: {
  nextEl: '.next',
  prevEl: '.previous',
},

// And if we need scrollbar
scrollbar: {
  el: '.swiper-scrollbar',
},

})

...