I have created a page in which I am showing A websites Page (situated some where on web );
I used iframe but puzzled with the height issues I solved width issues for 950px only with css3 but my need is full height as target website but that is not working with cross domain pages (I've done with same domain successfully).
Now I want to do it either with PHP using get_file_content() or some other putting it into div , iframe or in frames whatever works (and also pages must be accessible as it is from main sites)
The container will change its content with hyper link click.
Please help me to resolve the issues.
I've tried many more methods including jquery, js, php, css and blah blah blah with no success.
before commenting or answering please visit THIS LINK
I need some thing like this
Please check this and alter here
To See My page Click here
Note:
I have no access of target site so I can't put attributes on target
page and get back to iframe page.
I have 100+ pages to show so no
specific method can be used i need any generalized technology.
One more thing i don't want scrolling in my page.
Efforts done :
Ajax/Jquery
PHP Resize
In the "iframe'd" html, have:
<body onload="parent.resize_iframe(document.body.scrollHeight)">
and in the page that iframes:
<script type="text/javascript">
function resize_iframe(new_height) {
document.getElementById('iframed').style.height = parseInt(new_height, 10) + 60 + 'px';
}
</script>
I used 60px to fix potential padding etc.
Note that they have to be under the same domain for this to work, otherwise you might have to run:
<script type="text/javascript">
document.domain = "domain.com";
</script>
On either or both. This is required so that the browser may interact between them.
Do something like this:
<frameset rows="*">
<frame frameborder=0 src="http://www.discountautoparts.com/" scrolling="auto" noresize>
</frameset>
If you do that it should look like this picture
Related
I have an application form I need to work into an iframe, but I'm having a hard time with the links for it. Because the iframe was initially giving me errors, I started a work around by having a workaround.php file made that would be read as:
<!DOCTYPE html><html><?php echo file_get_contents($_REQUEST['url']); ?></html>`
Then in the iframe on my page I wrote:
<style><!--iframe.Application {
overflow: hidden;
}
--></style>
<iframe width="100%" height="800px" style="height: 100vh;" class="Application" scrolling="no" src="https://www.mywebsite/workaround.php?url=https://theotherwebsite.com"></iframe>
This worked out very well and I now had the form loading seamlessly onto my website. The next issue was that the links are not working. Any root-relative link within the iframe form was linking to "https://mywebsite.com/page2" rather than to "https://theotherwebsite.com/page2".
Now the manager of the website with the form would be able to change these relative links to absolute links, so this isn't a huge obstacle. To test if it would work, I edited the links in my browser to be an absolute to:
<a href="https://theotherwebsite.com/page2">
For this the iframe refused to connect. I'll need to continue to use workaround.php. Next I tried:
<a href="https://www.mywebsite/workaround.php?url=https://theotherwebsite.com/page2">
For a moment, I see the 2nd page load within the iframe, but then the page opens outside of the iframe in the same tab & window. Additionally, the page that loads is "https://www.mywebsite/workaround.php?url=https://theotherwebsite.com/page2"
At this point, I'm unsure of what link would function and stay within the iframe. I tried to add the "_parent" target.
<a href="https://www.mywebsite/workaround.php?url=https://theotherwebsite.com/page2" target="_parent">
but this changed nothing from my previous attempt. I tried likewise with _self and _top to find no change. _blank still functioned to open the page in a second tab.
At this point I'm not familiar enough with iframes to know what else to attempt. I hope my explanation of past attempts and results is easily understood. If any of you have a suggestion of what could be a solution please let me know!
TLDR: How do I open a link within an iframe of a php document without it opening a new tab?
I have an account with Simple In/Out. We have 50+ employees and display their statuses (In/Out of office) on a TV at the receptionist desk. However we can't fit all of the employees on the screen without scrolling.
Simple In/Out provides very limited styling to how the list is shown. With CSS I could remove dead space and visually improve the list.
At first I would inspect element and make a few changes however the screen would get refreshed and all changes lost.
I am trying to simply make a .html page that displays an iFrame of the List with Local CSS edits.
The list url is simpleinout.com/list- login and the list displays.
The following 2 files display the page and an appended CSS file with changes however if I click anywhere else the CSS file is removed.
simple.html:
<html>
<head></head>
<body>
<iframe src="http://localhost/~JohnHarbert/simple.php" style="border: 0" width="1920" height="1080" frameborder="0" scrolling="no" ></iframe>
</body>
</html>
simple.php:
<?php
$content = file_get_contents('http://www.simpleinout.com/list');
$content = str_replace('<head>','<base href="https://www.simpleinout.com/" /><head>', $content);
$content = str_replace('</head>','<link rel="stylesheet" href="http://localhost/~JohnHarbert/style.css" /></head>', $content);
echo $content;
?>
Again. The code does append the css file on the initial load(It adds it just before ). But when I click to display list. The css file is no longer added inside the Iframe.
You're help is much appreciated.
I'm the web developer behind Simple In/Out.
The easiest way to fit more users on your screen would be to use the font/column controls in the upper right. Once you've entered Full Screen mode, click on the gear icon in the upper right. It will allow you to choose anywhere from 2 to 6 columns of users and you can adjust the font size to fit more on the screen.
Hope that helps!
So what I want to do is create a subdomain on my website and have it load an external website into it without actually going to that website. For instance:
google.mydomain.com loads google.com but the URL bar reads google.mydomain.com.
How do I go about doing this?
I tried this but could not figure it out.
Trying:
iframe
I want page to take up the whole screen for each person's computer. Can I set it to 100% instead of x amount of pixels?
I want to remove scroll bars but it says not supported.
You can use either an Iframe, or file_get_contents();
Iframe:
<iframe src="http://google.com" style="width: 100%; height: 100%;">
file_get_contents():
<?php
echo file_get_contents('http://google.com');
?>
With file_get_contents(), you need to beware of the website you're fetching from using relative URL's, which will break the CSS, Images, Javascript, etc.
You are not going to be able to use php's include function, as this is not a resource residing on your server.
One option you could explore is loading everything in as the contents of an iframe: see http://www.w3schools.com/tags/tag_iframe.asp for some details about the iframe html element
iframe is now not supported in html5
it works on html5 also
Easy to add or remove
Example:
<body onload="window.location.href='https://www.google.com/'"> </body>
I have quite a small website, with a total of 3 webpages, consisting of only html, css and jquery...now on one of my .html pages, I have this annoying iframe injection (the source file is php) that is added on top of my body tag each time i load my page. Now I deleted all my referenced stylesheets, plugins etc one by one but the only way get rid of it is if I delete all my content for that page. How do I get rid of this iframe? Any tips?
Note that the same plugins I used on my other pages I used on this 'hacked page', except for one plugin...but removing that one plugin does not fix it...?
Here is the iframe code I got by inspecting the element: this whole part below is injected
<div style="padding-left: 120px;">
<iframe width="728" scrolling="no" height="90" frameborder="0" allowtransparency="yes" src="http://b.admedia.com/banner.php?id=18793&sr=1&injection_code=true&subid=FC&ip=[IP]&ua=[UA]&transparency=[TR]&highlight=0&style=1&appnxsId=860932&size=728x90&search=digital cameras&force=1&ref=&bpage=">
<html>
<head>
</head>
<body>
</body>
</html>
</iframe>
</div>
You almost certainly have malware on your PC.
For example, see this and this. Most likely you have a trojan that is injecting the code into explorer, enabling the attacker to farm for ad clicks.
You can confirm by trying a different browser or running a virus/malware scanner.
I have these two php variables: $img1src and $img2src, (them being PHP is irrelevant as you can echo a php variable anywhere) they both hold a URL of an image. I was wondering if I was able to preload these images, or cache them.
My goal is: when someone refreshes the page I want these pictures to instantly appear in a <img src >.
I'm not going to provide specific code, because I don't want to give you a fish, but rather show how google is a fishing pole.
I googled "php cache images tutorial" just to see what would come up. Below is a great resource.
http://dtbaker.com.au/random-bits/how-to-cache-images-generated-by-php.html
Can't get much better than that.
Caching an image isn't really a job for PHP. PHP should be used to decide whether or not to display it. (There are caching things you can do with PHP, but not in the same sense.) Essentially, what you want to do is make the clients browser request the second image. Once the browser gets the image, it should automatically send an "if-modified-by" parameter in the header. Next time you load the page, the response code should be 304 and your image should load instantly. You can choose from a variety of ways to do this. Load the image with javascript after the page has loaded (to prevent additional load time) or you can just include an image tag that is hidden on the page some where.
I also haven't tested it, but you might be able to send an ajax request to the image directly. I'm not sure if that way would cache it or not.
EDIT:
This isn't the most elegant solution, but it should get the idea across.
JS Example:
<?php
session_start();
if (!isset($_SESSION['graphic'])) $_SESSION['graphic'] = "http://www.tomsfreelance.com/laptop/DSC_0011.JPG";
else $_SESSION['graphic'] = "http://www.tomsfreelance.com/laptop/DSC_0012.JPG";
?>
<html>
<head>
<script>
function loadImage() {
document.getElementById('preload').style.backgroundImage = "url(http://www.tomsfreelance.com/laptop/DSC_0012.JPG)";
}
</script>
</head>
<body onload="loadImage();">
<div id="preload" style="display: none;"></div>
<img src="<?php echo $_SESSION['graphic'];?>">
</body>
</html>
Sure you can, try this javascript:
var image1 = new Image(), image2 = new Image();
image1.src = <?php echo $img1src; ?>;
image2.src = ?<php echo $img2src; ?>;
That should preload the image so when you append an img tag to the DOM the image should appear right away.
If your aim is to make less http requests overall: you can try CSS Sprites and/or Data Url methods of displaying these images. These methods will be the most effective when the images are smaller.