The presence of such support is established by the same criteria for CSS animation support we use for page transitions. Panels will animate if the browser supports 3D transforms. To resolve this you have to set the following rule for the element or its container:
The CSS that is used to do this can cause issues with buttons and form elements on the page if their container has a CSS multi-column layout ( column-count). To avoid blinks when opening a panel, we force hardware acceleration on WebKit browsers. Be aware of the fact that all your visible page content should live inside those page sections. Those are not included in the wrapper, but will transition in sync with it. An exception is fixed headers and footers. When opening a panel with display mode "reveal" or "push" the transition is applied to this wrapper.
If a page contains a panel the framework wraps the header, content and footer sections in a div. Where in the source order you place the panel markup will depend on how you want to page content to read for people experiencing the page in a C-grade device (HTML only) or for a screen reader.
Alternately, it's possible to add the panel markup after the header, content and footer in the source order, just before the end of the page container.
0 kommentar(er)
