Last active
December 28, 2015 22:39
-
-
Save nathansmith/7572887 to your computer and use it in GitHub Desktop.
Hide unnecessary <iframe> in Magento.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // This matches any <iframe> that is used to overlay content. | |
| // | |
| // Example: | |
| // | |
| // <iframe style="... z-index ..."></iframe> | |
| @media screen and (max-width: $media-mobile-max) | |
| iframe[style*="z-index"] | |
| display: none |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I recently helped a coworker debug an issue related to this code snippet.
When displaying a modal, Magento (an e-commerce CMS) uses the old trick of overlaying an empty
<iframe>atop the page's main content.It ensures that form elements like
<select>don't show through in older versions of Internet Explorer.However, this invisible layer also intercepts swipes on mobile devices.
So we just hide it, since it's not needed for any browsers other than legacy IE anyway.