Thanks for the codepens, they are really helpful. Regarding the second case, when an iframe has
display: none, the problem is related to firefox. You can read a bit more about it here. As a workaround, you can set visibility to hidden and width and height to zero, and then change them on 'viewerready'. I do this using a class hidden.
Working example here:
I will try to take a look at the other examples during this week.
Edit: used class hidden instead of changing directly the inline styles