Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-51451

Moodle dialogues: 'Lock scroll' feature causes centered theme to jump

XMLWordPrintable

    • Icon: Bug Bug
    • Resolution: Fixed
    • Icon: Minor Minor
    • 2.8.9, 2.9.3
    • 2.9.2
    • JavaScript, Themes
    • MOODLE_29_STABLE
    • MOODLE_28_STABLE, MOODLE_29_STABLE
    • MDL-51451-master
    • Hide
      1. Use a browser which displays scrollbars, such as Firefox on Windows.
      2. Using default Clean theme, set up a course that contains blocks on the right.
      3. Turn editing on.
      4. Click 'Add an activity or resource', then cancel the dialogue (and repeat as necessary) while observing the right-hand blocks

      EXPECTED: The blocks on the right should remain in exactly the same position
      BEFORE FIX: The blocks on the right shift slightly

      1. Find or create a course with many questions in the question bank.
      2. Add a quiz and go to the Edit quiz page.
      3. Click Add -> From question bank
      4. Verify that the main browser window has a scroll bar. (If not, the question bank is not showing enough questions. Try the Show all 123 link at the bottom, and/or the Search options -> Also show questions from subcategories setting.)

      EXPECTED: The blocks on the right should remain in exactly the same position
      BEFORE FIX: There was no shift in this case. (This is to make sure we have not introduced a regression.)

      Note: In Clean theme, the header bar is aligned with the browser viewport (not body) so that still shifts slightly. However this fixes the main part of the problem.

      To test more comprehensively, repeat on other browsers including those which don't count the space as wider without scrollbars (and didn't have the problem before or after this change). For example, IE11 in Windows appears to be in this category.

      Show
      Use a browser which displays scrollbars, such as Firefox on Windows. Using default Clean theme, set up a course that contains blocks on the right. Turn editing on. Click 'Add an activity or resource', then cancel the dialogue (and repeat as necessary) while observing the right-hand blocks EXPECTED: The blocks on the right should remain in exactly the same position BEFORE FIX: The blocks on the right shift slightly Find or create a course with many questions in the question bank. Add a quiz and go to the Edit quiz page. Click Add -> From question bank Verify that the main browser window has a scroll bar. (If not, the question bank is not showing enough questions. Try the Show all 123 link at the bottom, and/or the Search options -> Also show questions from subcategories setting.) EXPECTED: The blocks on the right should remain in exactly the same position BEFORE FIX: There was no shift in this case. (This is to make sure we have not introduced a regression.) Note: In Clean theme, the header bar is aligned with the browser viewport (not body) so that still shifts slightly. However this fixes the main part of the problem. To test more comprehensively, repeat on other browsers including those which don't count the space as wider without scrollbars (and didn't have the problem before or after this change). For example, IE11 in Windows appears to be in this category.

      When you add a module or otherwise cause a Moodle dialogue to appear, this enables the 'lock scroll' feature which means the scrollbar disappears.

      On some browsers (Firefox in Windows, yes; mobile browsers, no; Safari on Mac, probably yes or no depending on OS settings), scrollbars take up horizontal space.

      If the theme is centered or has right-aligned elements, the 'lock scroll' feature therefore means that elements of the current view jump slightly behind the dialogue.

      The best way to resolve this is to temporarily fix the body width while the lock scroll feature is active.

            quen Sam Marshall
            quen Sam Marshall
            Eloy Lafuente (stronk7) Eloy Lafuente (stronk7)
            Andrew Lyons Andrew Lyons
            Simey Lameze Simey Lameze
            Votes:
            2 Vote for this issue
            Watchers:
            5 Start watching this issue

              Created:
              Updated:
              Resolved:

                Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.