Как исправить заголовок в подменю мобильного телефона jQuery - PullRequest
1 голос
/ 21 февраля 2020

Я очень плохо знаком с jQuery и не могу решить следующую проблему: у меня есть главное меню, и щелчок по главному меню открывает подменю с несколькими пунктами.

<head>
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
  <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
  <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"> </script>
</head>
<div role="main" class="ui-content" style="background-color:#dae5f4;">
  <div class="ui-field-contain">
    <!-- ui-field-contain to wrap select elements -->
    <label for="items" class="select">Sub-Header</label> 
    <select id="items" name="items" size="1" data-native-menu="false">
      <option value="">Main-Header</option>
      <option value=1>Item 1</option>
      <option value=2>Item 2</option>
      <option value=3>Item 3</option>
      <option value=4>Item 4</option>
      <option value=5>Item 5</option>
      <option value=6>Item 6</option>
      <option value=7>Item 7</option>
      <option value=8>Item 8</option>
      <option value=9>Item 9</option>
      <option value=10>Item 10</option>
      <option value=11>Item 11</option>
      <option value=12>Item 12</option>
      <option value=13>Item 13</option>
      <option value=14>Item 14</option>
      <option value=15>Item 15</option>
      <option value=16>Item 16</option>
      <option value=17>Item 17</option>
      <option value=18>Item 18</option>
      <option value=19>Item 19</option>
      <option value=20>Item 20</option>
      <option value=21>Item 21</option>
      <option value=22>Item 22</option>
      <option value=23>Item 23</option>
      <option value=24>Item 24</option>
      <option value=25>Item 25</option>
      <option value=26>Item 26</option>
      <option value=27>Item 27</option>
      <option value=28>Item 28</option>
      <option value=29>Item 29</option>
      <option value=30>Item 30</option>
    </select>
  </div>
  <!-- end of div class=ui-field-contain -->
</div>
<!-- end of div role main -->

Теперь я хочу исправить подзаголовок, чтобы он больше не прокручивал все элементы. К сожалению, data-position="fixed" не сработало.

1 Ответ

0 голосов
/ 21 февраля 2020

Вы можете решить это, используя CSS. Если вы хотите ограничить высоту всплывающего окна, чтобы оно не прокручивалось, когда оно открыто, вы можете использовать максимальную высоту 60 Вч или подобное и установить вертикальную прокрутку.

.ui-selectmenu.ui-dialog .ui-content {
  max-height: 60vh;
  overflow-y: scroll;
}

И чтобы исправить это, если вы хочу добавить это CSS:

#items-dialog {
  position: fixed;
  left: 0;
  top: 0;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...