Make WordPress Core

Opened 3 years ago

Last modified 3 years ago

#20805 closed defect (bug)

Theme Customizer: Preview should be scrollable on iPad and Kindle Fire — at Version 4

Reported by: koopersmith Owned by:
Milestone: 3.4 Priority: normal
Severity: normal Version: 3.4
Component: Customize Keywords: commit has-patch
Focuses: Cc:

Description (last modified by nacin)


Currently, the customizer preview iframe is not scrollable on iPads. Originally, Mobile Safari was supposed to scroll iframes with two fingers, but has been broken since at least iOS 4.2.1.

Applying the following to the parent element allows the iframe to scroll with one finger, but will not render any iframe contents that were originally out of the frame when scrolled (it just becomes white). Also, when the preview is refreshed, the iframe stops scrolling altogether.

#customize-preview {
overflow: auto;
-webkit-overflow-scrolling: touch;

For more information on this technique, see:

Kindle Fire

(Originally #20806.) The customizer's preview frame is scrollable on the Kindle Fire... but only if you zoom in first. If the page is fully zoomed out, the viewport is locked.

Change History (9)

@azaozz3 years ago

@azaozz3 years ago

@azaozz3 years ago

@azaozz3 years ago

comment:1 @azaozz3 years ago

Apart from the scrolling, the customizer looks and works pretty well on iPad (added few screenshots).

comment:2 @azaozz3 years ago

Above patch is only for testing support for iOS Safari.

comment:3 @nacin3 years ago

If customize-preview.dev.js-testing.patch works, can it be formulated into a proper patch? Does it fix issues in the Kindle Fire (#20806) as well?

comment:4 @nacin3 years ago

  • Description modified (diff)
  • Summary changed from Theme Customizer: Preview should be scrollable on iPad to Theme Customizer: Preview should be scrollable on iPad and Kindle Fire

Per azaozz, customize-preview.dev.js-testing.patch does address problems in the Kindle Fire as well.

Note: See TracTickets for help on using tickets.