[Modal] Scrolling should work after showing modals #6477

searene · 2018-07-12T00:19:00Z

Steps

The following html does nothing but shows a modal. However, after that, scrolling doesn't work on mobile devices(although it works on desktop browsers).

Note that scrolling works on mobile devices after the following line is removed.

  $("#test-modal").modal("show");

So I think maybe modal did something that prevented scrolling on mobile devices.

<html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" type="text/css"
        href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.2/semantic.min.css">
  <script
      src="https://code.jquery.com/jquery-3.1.1.min.js"
      integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
      crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.2/semantic.min.js"></script>
</head>
<body>
<pre>
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
    contents
</pre>
<div class="ui basic modal" id="test-modal">
  <div class="ui header">
    header
  </div>
  <div class="content">
    <p>content</p>
  </div>
  <div class="actions">
    <div class="ui green ok inverted button">
      <i class="checkmark icon"></i>
      OK
    </div>
  </div>
</div>
<script>
  $("#test-modal").modal("show");
</script>
</body>
</html>

Expected Result

Scrolling on mobile devices should work after showing the modal.

Actual Result

Scrolling doesn't work on mobile devices after showing the modal.

Version

2.3.2

Testcase

https://jsfiddle.net/t30wbo6n/1/

ColinFrick · 2018-07-12T05:08:08Z

Duplicate of #6449

y0hami closed this as completed Jul 13, 2018

This comment was marked as spam.

# to view

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Modal] Scrolling should work after showing modals #6477

[Modal] Scrolling should work after showing modals #6477

searene commented Jul 12, 2018

ColinFrick commented Jul 12, 2018

This comment was marked as spam.

[Modal] Scrolling should work after showing modals #6477

[Modal] Scrolling should work after showing modals #6477

Comments

searene commented Jul 12, 2018

Steps

Expected Result

Actual Result

Version

Testcase

ColinFrick commented Jul 12, 2018

This comment was marked as spam.