In my (school) website we use Iframes to display class blogs (on blogger). This works well EXCEPT if the user then clicks on (say) a photo inside the iframe. Blogger (in this case) then displays the photo in the whole browser window and the back button loops; that is if the back button is hit, the browser (IE, FF, Chrome) stays on the same page. The only way out is for the user to jump back two pages (which many of our users don't know how to do).
I've read a lot of posts on back buttons and iframes and there doesn't appear to be a simple solution. Bear in mind that I don't have control over the iframe content (so no embedded back buttons in the frame are possible). Ideas anyone?
The solution I would use would be to loop through the iframe content after it has been loaded and set target attributes on links in the iframe so that they open in either the iframe, or in a new window. Here's an example using jQuery:
$('#iframeID').contents().find('a').attr('target', '_blank');
You could do something similar using a loop and DOM methods, I'll post some code to do that if your not sure how to go about it.
EDIT: can't access the content if its cross domain, so this wouldn't work in this case
Related
So I seem to have found myself in a bit of pickle. In order to keep a header flash element from reloading every time someone goes to a different page, I encapsulated all my site's content in an iframe. Unfortunately, some of the iframe's include thickbox, which opens an iframe of it's own. The iframe that thickbox opens, requires it be opened on the topmost page, so that the fixed attribute allows the iframe to remain static in the viewport. Because we're already nested into an iframe, this isn't possible.
This is the most promising lead I have so far:
http://blog.codepyro.com/2010/01/thickbox-inside-of-thickbox-iframe.html
Unfortunately, that only replaces the iframe that the thickbox is being opened from, with the content of the thickbox.
I also just came across this, but I'm not sure how I would go about retooling it to suit my needs:
open iframe fancybox from within an iframe so that it opens in the parent
Here is a link to what I'm working on:
http://www.lalalandmusicfestival.com/site/
The problem area is on the Talent page.
I think if there was a way to force the link to target the "top" or "parent" page with javascript, it may be possible, but I haven't found anything that's been of any use to me yet.
Thanks in advance for your help!
I am adding framed content to a wordpress blog in a membership area. Is there a way that I can prevent that content from being opened in a new window or tab? A plugin or a string of code I can add?
As it is now if someone right clicks on the frames content they can view it in a new window and possibly share that URL rendering the membership site useless in controlling who views....
I would like a block.... If possible...I see other iframes popup an error message when you try and view....
Any help is appreciated!
Thank you for a great place for info
One possible solution I can think of is now to add JavaScript code to prevent right click, but again this is not always going to work because the person can simply disable JavaScript and they can still right click to see the content of the iframe. Not only that there is alway a way to sniff the URL of the iframe by either using some sort of software or even using something like FireBug.
I'm new to chrome extensions development and I'm building one that requires a side panel (not the popup), like firebug but on the right side.
I'm using jsTree (with json_data) in the side panel and I want to drag elements from the webpage to the side panel.
So far, to create the side panel, I've used a div appended to the body with a z-index so that it appears above the webpage, but the elements' styles in my side panel are altered because of the website's css.
So I thought I could use an iframe to avoid any css incompatibility within my side panel.
I create the iframe dynamically, with a src="chrome-extension:///page.html".
I've managed to make my jstree work fine in my iframe by loading the jquery+jstree scripts directly in the iframe's source page... that's pretty bad but I can't get the content script to be used for the iframe's source page (despite "all_frames": true).
I'd like to drag elements from the website's page into jstree in the iframe...
I've found the iframeFix: true and refreshPositions: true, but that doesn't seem to change anything...
Anyone knows how to do that?
If I don't use an iframe, according to the multiple examples on the web, I can easily drop an element to the jstree using the dnd plugin.
I haven't tried it; even if it worked, the css in my side panel will be altered and I can't let that happen.
I've seen the "div layer above the iframe" technique. I can successfully drop an element from the webpage on that div above the iframe.
But, when I try to post a message (containing the dropped elements' data) to the iframe through a port the iframe doesn't receive the message.
My idea in this case is to somehow add the message to the json data of jstree.
I've read all the posts I've found about content_scripts and iframe, I know about the bugs... I can't figure out if it's fixed or not, and if it is, I don't know how to make the port communication between the ifram and the content script work.
Anyone knows more about that?
I should also add that when I try to communicate between the content script and the iframe using a port, and copy the listener from the iframe in the background page, the background page receives the message just fine... which just means that the port communication is working fine I suppose, but not between the content script and the iframe...
Any thoughts? I'm really stuck
answering my own question;
I haven't found a solution on how to use iframes in a chrome-extension with jstree.
I'm just going for the hardcore way; append a <div> to the <body>, and make sure by doing a lot of testing that the css inside my <div> will remain isolated from the webpage's css.
Cheers
I have created a web page which for example contains some links and an iframe. These links are opened in iframe, so everything outside iframe is static (parent content doesn't reload). All works fine and all my pages are well structured so that it's easy to understand code of page.
But when I press a middle button on one of the mentioned links (to open it in a new tab or window) that isn't in iframe and normally should open in iframe, a browser will only display the content which is inside iframe and parent content will be lost.
What could be the best solution for this problem?
The only thing I need is an iframe which works as usual, targeted links are opened in it.
If a link is opened in a new tab or window, it looks the same if the link would have opened with a left click of mouse.
Instead of links you can use buttons, on them right or middle click can't be performed.
Better solution. Now I'm using jQuery BBQ with modified and improved initialization code.
I've just created a tshirt shop to put on my own website. A company called spreadshirt.co.uk (hereafter "SS") runs the shop. They allow me to embed their shop on my site via an iframe, and since they allow the CSS to be fully customisable through their admin panel I've got it looking pretty neatly integrated with my site.
The only catch is the iframe - I've set it to 2000 pixels high at the moment (just right for the longest pages). I'd rather have it resize for each page, but expect that to be "hard" so didn't bother.
Anyway, I've just put the page live, and put a test order through it. All is good, until....
...the "Verified by VISA" page. This motherhubbard turns up right at the end of the order process, and the HTML contained in it puts the little dialogue centred vertically in my iframe. I.e. nearly 1000 pixels down from the top - making less savy users think the page hasn't loaded (all they can see without scrolling down is a white background). I can't customise the CSS on this page like I can the SS pages, as this page isn't served up by SS.
Any clever ideas???
Many thanks people!
I'll put a link to my site if people want to see it, but assumed that might be seen as spammy and frowned upon.
I don't deal with iframes too much as i hate them, but i think you can still write to that document using javascript. Reason i say maybe is because its cross domain, but it should still work.
Check this post out
Resizing an iframe based on content
You could also check out
Resizing iframe to fit its content
and a jquery script:
http://www.lost-in-code.com/programming/jquery-auto-iframe-height/
Again, I really don't know if this will work on a cross-domain website.