Inside a website I have an iframe that loads another website, like the code below :
<iframe style="border: 0; width: 100%; height: 100%" src="https://www.mywebsite.com"></iframe>
It's working BUT the iframe does not respect the user agent. The www.mywebsite.com has specific versions for mobile and desktop, but when I open it inside the iframe in a mobile device, it will load the desktop version instead. If i open the same site directly on the URL on the same mobile device, the correct version (the mobile one) is shown.
What should I do on the iframe code to it loads the mobile version instead?
<iframe style="border: 0; width: 100vw; height: 100vh" src="https://www.mywebsite.com"></iframe>
Try this code instead I think it will work
Related
I want to preview a mobile page on a PC page which has an iframe to simulate a mobile device. But mobile event can't be supported in iframe such as sliding.
How to totally simulate a mobile device by iframe?
<div class="preview>
<iframe src="http://path.to.my/mobilePage.html"></iframe>
</div>
.preview{
width:375px;
height:812px;
}
.preview iframe{
width:100%;
height:100%;
}
P.S. CROSS MODERN BROWSERS.
Chrome has the function you wanted.
https://developers.google.com/web/tools/chrome-devtools/device-mode/
<iframe src="https://stackoverflow.com" width="255" height="320"></iframe>
Check this : http://mattkersley.com/responsive/
But in the technical side: you can use height and width and the content will respond to that.
And also if you want to test your site with its mobile events, try using the built in chrome/firefox extension just press Ctrl+Shift+M
I'm trying to figure out why my images aren't displaying properly within my iframe. Every browser works fine with the exception of Firefox and Safari. I can still click the links within the iframe and open up the corresponding page, but the images just won't display. I am using the instansive instagram widget as my iframe content (instansive.com). Their code looks like this - >
<!-- INSTANSIVE WIDGET --><script src="//instansive.com/widget/js/instansive.js"></script><iframe src="//instansive.com/widgets/427ad0d8ae95cfc36f19bb10c960dbf03bbef870.html" id="instansive_427ad0d8ae" name="instansive_427ad0d8ae" scrolling="no" allowtransparency="true" class="instansive-widget" style="width: 100%; border: 0; overflow: hidden;"></iframe>
I'm not sure as to what I am doing wrong, or why it isn't displaying correctly with these two particular browsers.
There is nothing to do with iframe. Try giving the image path as /test/image.jpg instead of full path. This may work
The source code is :
<iframe id="privacy-frame" frameborder="0"
src="http://www.cnn.com/partners/mobile/v2/privacy.policy/"
style="width: 100%; background-color:#fff">
</iframe>
When i try to browse the page http://mobile-demo.turner.com/election/tos.html in iphone the internal links doesn't work.
But if i try to browse the page with src URL(http://www.cnn.com/partners/mobile/v2/privacy.policy/) it works.
Is this some issue with iFrame on iphone? Same code does work on Android browser or desktop browser.
I'm not sure why the ps3 browser won't scroll down the rest of the web page; it works on all pc browsers ok. The site contains a flash swf file (as3), some small pictures and a little text. Other than that its just html, css, and js(for swf file embedding).
Website Link
It doesn't scroll because you have this:
body {
height: 100%;
margin: 0;
overflow: hidden;
padding: 0;
}
Which hides the scrollbars, to fix this remove overflow:hidden
I have an invisible iframe that is talking to an atmosphere comet broadcaster. It works fine on most of the computers in the office.
On one computer in the entire building it breaks. The problem seems to be that there is an iframe that somehow gets inserted on that machine:
<iframe style="position: absolute; width: 5em; height: 10em; top: -10000px;" src="javascript:'
<html>
<head>
<script>if("loadFirebugConsole" in window){window.loadFirebugConsole();}
</script>
</head>
<body>
</body>
</html>'">
</iframe>
(note that most of this html is actually within the src for the opening iframe tag).
That iframe blinks in and out of existence, and when it does it clobbers my iframe that's handling the comet service.
I assume that this has something to do with firebug tools having been installed, but it happens on chrome as well as on firefox.
Has anybody else come across a this behavior?
The site uses Dojo, and it turns out that, in at least some cases, dojo inserts that iframe if you create an iframe and have firebug installed on the computer.