javascript - Achieve smooth iFrame navigation -
I have an iframe with navigation, which means that iframe src will change when navigating inside it. The navigation code inside the iframe is something like this:
window.location = "new URL";
This user experience is working, while in fact on mobile devices (I can see a "blink" / "flash" when iFrame changes their source) is actually bad
I tried to apply anything similar to Chris Searier, while navigating the parents to trigger the postmass, to hide / show IFrame, while the SRT is changing. Something like this (this is inside the parents' post message event):
var $ iFrame = $ ('iframe'); $ IFrame.css ({'Visibility': 'Hidden'}); $ IFrame.load (function () {$ iFrame.css ({'visibility': 'visible'})}}
This will work, but the result is not good - I now I can also see the "blink" when the iframe is being hidden by my new code.
In my third attempt, a new iframe is included and gives it a new source, only when it shows it The first one is hiding and its results are not well:
var $ iFrame = $ ('. IFrame1'); Var $ iFrame2 = $ ('. IFrame2'); $ IFrame2.attr ('src', anac $ IFrame2.css ($ '' visibility ':' visible '}); $ iFrame.css ({' visibility ':' hidden '})}}; < / Code>
Any help to get a smooth transition (on mobile devices!) Will be greatly appreciated!
If I do not understand your problem correctly, then you can try to change the opacity, and not the visibility. With this change you will be able to give it a small fade-transition. Can be achieved with the C or JPL is, whatever you want.
Comments
Post a Comment