iFrame not loading on page load (jQuery Mobile)

html, iframe, jquery-mobile, refresh

Solution

i just tried with the rel="external" it works without refreshing.. The first link is ajax call and the second link is not. it was straight forward, not sure if im missing something else you have..

Page1.html

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Demo Page</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
</head> 
<body> 
<div data-role="page">
    <div data-role="header">
        <h1>Demo Page</h1>
    </div>
    <div data-role="content">           
        <a href="page2.html" data-role="button">Another Page</a>
        <a href="page2.html" rel="external" data-role="button">View User Manual</a>         
    </div>
</div>
</body>
</html>

Page2.html

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Another Page</title>     
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
</head> 
<body>

<div data-role="page" data-add-back-btn="true">
    <iframe id="manual" src="FocusFree.pdf" style="width: 100%; height: 100%;"></iframe> 
    <div data-role="header" data-theme="none">
        <h1>Another Page</h1>
    </div>
    <div data-role="content" data-theme="none"> 
        <p>This is another page, dude.</p>
    </div>
</div>

</body>
</html>

Problem

I am having trouble getting an iFrame to display the first time that my jQuery mobile backed page loads. I have an iFrame as follows: `<iframe id="manual" src="pdf/manual.pdf" style="width: 100%; height: 100%;"></iframe>` And for some reason, when the page loads, the iFrame fails to load with it. I can only see the PDF file if I REFRESH the page. Why is that? Why is the PDF file not showing up in the iFrame in the first place without a page refresh? Thanks everyone for any insight. EDIT: When I try to ope the page with safari, I get the following warning: `Resource interpreted as Document but transferred with MIME type application/pdf.` Could that have something to do with why the PDF doesn't load correctly?

Original source

Related problems