Solved

Add style to cross domain iFrame

Posted on 2010-08-16
5
5,090 Views
Last Modified: 2012-05-10
I want to add a style to a cross domain iframe so that the left nav and header are hidden in the iframe.  I basically just want to display the main content in the iframe.

I know that doing this with javascript is problematic due to security restrictions.  I don't have easy access to the iframe code but I might be able to add something as it is on the Point2 realestate site and there might be a way to add content but I think I would have to add some javascript.

If so, maybe there would be a way to just check if there is a parent frame and if the parent frame is my frame.  I could then set the style of those elements to display: none.  Wondering if there is another way with CSS in the iframe of some other method.  I don't think there is an easy way or any way to do it from the parent.
0
Comment
Question by:sscotti
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 6

Expert Comment

by:stilliard
ID: 33449607
You could try using php, you could have your iframe link to a page on your domain, which would request the page you want, but you could also embed css into the page this way.

Other than this, i found a site asking what i think is the same question and they have several ideas on there.
http://stackoverflow.com/questions/217776/how-to-apply-css-to-iframe
0
 
LVL 5

Author Comment

by:sscotti
ID: 33449653
Can you elaborate on the first option.  I am using PHP.  Is this pretty much like using a proxy?
0
 
LVL 6

Accepted Solution

by:
stilliard earned 500 total points
ID: 33449781
basicly your php file refferenced by the iframe should look something like this:

 
<?php

// set the url of the page you would have previously linked to in the iframe
//$url = 'http://www.website-to-request.com/';
$url = 'http://www.reallyeasycart.co.uk/';

// Setup the new css you want to inject into the page 
$css = '
<style type="text/css">

body { background: green; }
.some-other-elements { ... }

</style>
';

// Get the file contents (you may want to replace this with a curl request 
$site_content = file_get_contents($url);

// a simple way to inject style into this page would be to ad it directly above the closing head tag (if there is one) 
// this can be changed to any element, or even using the dom class you could ammend this with more detail. 
$site_content = str_replace('</head>', $css.'</head>', $site_content);

// you may also need to inject a base href tag so all the links inside are still correct
// comment out the next line if not needed 
$site_content = str_replace('<head>', '<head><base href="'.$url.'" />', $site_content);

// return the site contents to the browser
echo $site_content;
?>

Open in new window

0
 
LVL 6

Expert Comment

by:stilliard
ID: 33449810
sorry about that, just ignore the reference to the url on there, ive been looking at there e-commerce cart today and thought id test this script on them for a second, its not important to the script anyway.
basicly you would replace that url with the one you want to use,
and then add the css into the $css var.
0
 
LVL 5

Author Closing Comment

by:sscotti
ID: 33451050
I like that.
0

Featured Post

SharePoint Admin?

Enable Your Employees To Focus On The Core With Intuitive Onscreen Guidance That is With You At The Moment of Need.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Javascript reference in ExcelWebAddIn Project 2 32
Add Rows on a Table 8 48
Textbox autocomplete using jquery in asp.net 13 45
Page link not showing on Mobile Device 3 43
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

738 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question