JQuery mobile app when inserting an iframe back button not working
When I put an iframe for a video that is playing in my application, the back button in the jQuery UI header no longer works.
When I exit the iframe from the code, it functions correctly again. I wonder if anyone knows about this here, the code for a page with an iframe included.
<div data-role="page" id="about" data-add-back-btn="true" data-back-btn-text="Back" >
<div data-role="header" >
<h1>About</h1>
</div><!-- /header -->
<div data-role="content">
<div id ="aboutsection">
<div id="about-logo"><img src="images/small-logo.png" /></div>
<div id="video-thumb">
<a href="#popupVideo" data-rel="popup" data-position-to="window"><img src="images/video-thumb.png"/></a>
<div data-role="popup" id="popupVideo" data-tolerance="15,15" class="ui-content">
<iframe src="
http://player.vimeo.com/video/54553882?portrait=0" seamless></iframe>
</div>
</div><!--/video-thumb-->
<p>© Be Active North-East</p>
</div><!--/aboutsection-->
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<h4>Be Active North East </h4>
</div><!-- /footer -->
+3
source to share
1 answer
I have similar problems, and got a pretty good result with this js;
function goBack(){
var url = $.mobile.urlHistory.getPrev().url;
if (url === null || url == "") url = $.mobile.firstPage.attr("data-url");
$.mobile.changePage(url, "slide", true, true, true);
}
And that button is back
<a href="" data-role="button" data-inline="true" data-icon="back" onclick="goBack()">Back</a>
+1
source to share