How do i control the rendering the content in a iframe

Posted on 2008-01-30
Medium Priority
Last Modified: 2008-03-06
I've been asked to integrate a clients site into ours, and we're looking to do this via an iframe - however unfourtunitly we need to overrde some of the CSS styles within the source of that iframe.

Now my requiremnt is simple i.e. I just need to append/if necessary manipulate the content of an iframe.

However i'm getting nothing but problems trying to do this i.e. if i try using javascript i get access denied e.g.

         var method1 = window.frames['uxIframe'].document;
          var iframe=document.getElementById("uxIframe");
          var method2 = iframe.contentDocument;

So my plan b was to use HttpWebResponse / request to stream the info, and this seems to work e.g. please see below... But i can't add it as the contents of an iframe, which is needed otherwise i'll get a number of JS errors?

Is there anyway around this or better yet an alternative approach?

Dim request As WebRequest = WebRequest.Create("http://www.google.com/")
        ' If required by the server, set the credentials.
        request.Credentials = CredentialCache.DefaultCredentials
        ' Get the response.
        Dim response As HttpWebResponse = CType(request.GetResponse(), HttpWebResponse)
        ' Display the status.
        ' Get the stream containing content returned by the server.
        Dim dataStream As Stream = response.GetResponseStream()
        ' Open the stream using a StreamReader for easy access.
        Dim reader As New StreamReader(dataStream)
        ' Read the content.
        Dim responseFromServer As String = reader.ReadToEnd()
        'How do i Display the content?
        'uxIframe.InnerHtml = responseFromServer
        'uxIframe.InnerHtml = ""
        'Label1.Text = responseFromServer
        ' Cleanup the streams and the response.

Open in new window

Question by:paulCardiff
  • 3
  • 2

Expert Comment

ID: 20778564
I don't believe there is a way to do this, for security reasons. An iframe's styles must come from the iframe page itself. You can't impose changes using the containing page. This is to stop people changing pages from other websites. If the page comes from your own website, you must find a way to make the changes to it directly, rather than using the page with the <iframe> tags in.

Is it a page from your own site?


Author Comment

ID: 20778715
This page is for a client / supplier - so changing it isn't an option - they've given us permission to this but  its on me now to find a way to do it.

THing is as i'm not looking to change the content rather jsut add to it i'm sure theres someway of doing this?

i.e. sure = Hope :-)

Accepted Solution

Jezcentral earned 1000 total points
ID: 20778944
Sorry. It can't be done. Otherwise you can have  have words (or more importantly, prices) disappear, by changing them to match the background.


Author Comment

ID: 20785133
What about doing this via custom httphandlers? would that make this possible

Expert Comment

ID: 21013892
Sorry, I don't know about that. I've always worked on the principle that iframes of pages from another site are inviolate. Personally, I'd be horrified if such manipulation were possible. (But then, the internet can be a horrifying place :) )

Featured Post

Take Control of Web Hosting For Your Clients

As a web developer or IT admin, successfully managing multiple client accounts can be challenging. In this webinar we will look at the tools provided by Media Temple and Plesk to make managing your clients’ hosting easier.

Question has a verified solution.

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

CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

599 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