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.
Related
I just made a page in WP which has 3 iframes inside it. One is a google Calendar, and two others are Google Docs (spreadsheets).
The google calendar works fine, but everytime I click on something in the google docs, it scrolls my whole page (not my iframe, but the page that contains the three iframes) to the top. I simply want it to not scroll, and stay in the same place, so I can edit the Google doc document on my website.
Any chance you have switched on caret browsing in FF? press F7 to toggle
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'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 widget kind of. In reality I put the information in a php file and then I provided the Iframe code for this file to my members.
Considering site A is member's site and site B is my site.
Site A shows the IFRAME:
<iframe src="http://siteB.com/try.php" height="240px" width="286px"></iframe>
When this IFRAME is clicked, it opens a new pop window, because of this code:
<?php echo $status_img; ?>
So far so good.
Now the problem is this pop up window also has a link. How can I make this link open outside this IFRAME, to be more specific, to take them to Site B , my site . At the moment this link opens inside the iframe and it can't be used this way.
This last link is:
<a onclick="return targetopener(this,true)" target="_top" href="http://siteB.com/services.php">
It works perfectly in my site but not in an Iframe. I know I complicated myself a little with this iframe but I adapted a solution to my poor knowledge. I'm opened to new solutions though, if this link can't be opened outside the Iframe. Thank you in advance!
Try changing target to _parent if you want the link to open in the previous window (it's parent window). So if site B opens up a pop-up with site A inside that then must refer them back to Site B then this should open the link in the window that spawned the popup.
But if you want it to open a new window that leads to your website then of course use _blank.
You can use this base tag. Place the tag in the iframe. Should solve your issue.
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