We have a web page in our solution that uses an iFrame to display a vendor's web page. Usually when a user navigates away from this page that hosts the iFrame, all the other pages render just fine. The vendor just redesigned the content of their page, however, and while their new page looks fine in the iFrame and that hosting page works fine too, any time a user navigates away from the hosting page, the page being redirected ~to~ does not render properly. It's just completely blank. An f5 will get it back, but I'm wondering what I can do to fix this. The vendor says it's not their problem, but that's the only thing that changed. I've tried both redirecting the iFrame to blank and removing it outright via javascript (see below), and while I can see the iFrame disappear just before the redirect, the redirected to page still will not render without hitting f5.
window.onbeforeunload = function ()
{
document.getElementById('<%= ifr.ClientID %>').src = "about:blank"
$("#<%= ifr.ClientID %>").remove();
}
Can anyone give a suggestion of why this is happening and how to prevent it?
TIA
-VG
I've had a similar problem when using an iFrame containing a page from our payment card processor embedded in our eCommerce pages. I couldn't see anything in the source of the iFrame that might be causing the problem, so I opened up space for the iFrame, contained it in a div (my last element on the page) and used position to render the iFrame in the position I wanted it. Hardly responsive design, but it worked!
For anyone coming to this from the first Google result, this can be caused by your iframe being self-closed (ending with />). To fix it you just need to close the iframe with </iframe> instead. This may not be the original problem but it worked for me.
Related
so we're having a very strange problem here. Whenever we try to open one of our blog entries directly by typing its URL into the browser, it doesn't load correctly (without any text). However, when we try to access it over a link on another page, it works just fine.
Even more strange: When we see the broken page and click Inspect Element, the missing content appears. This might be because the site is being reloaded when you click that.
The problem only exists in Chrome and only on this website:
Direct URL: http://www.myfeelix.de/immobilienkauf-behalten-sie-den-ueberblick-beim-papierkram/
(try copying this manually into the browser and you'll see what I mean)
Accessing it from this website works (first blog entry up top): http://www.myfeelix.de/category/feelix-experten-blog/
Anyone got any ideas?
UPDATE: The problem disappears when we disable Google Fonts. Any more ideas why this is causing a problem?
I'm building a contact form for a mobile website in HTML5 and CSS. It is the same form I use on all mobile website and after not working for 5 hours I pulled the code straight from a working site I built and it still doesn't work properly.
The issue is when you go to the contact page it shows the contact form, but with the labels centered and the submit button image isn't showing up. I must refresh for it to bring up the correct CSS file to align the text left and show the submit button. Initially I thought it was from a CSS/JS conflict with my menu at the top so I pulled that and it still causes the same problem. I have cleared the cashe on my phone and web browsers and they all work the same.
Here is the link: www.lpokc.org/mobi/contact.php after going to this page hit refresh and you will see the difference.
My question is, is this a caching issue, is it server side issue, or is it a conflict in my coding. I'm not good with posting the code on this site but if you go to the mobile site from your web browser you can just right click and view source to see my code. I have a boiler plate html core file with boiler plate CSS and custom CSS.
Is there some sort of script I could use to make this page auto refresh one time on page load then not again after the reload? I don't want to use an improper fix like this but I have been working on this issue for a day.
The left side is before refresh. I have pulled the code from the site now but I think it was a js conflict because it was auto loading the css from the menu when the link for any page was clicked.
I'm seeing it fine on my end. Seems to work flawlessly, but if you are still having a problem, you could either use cookie or session variables. If the variable does not exist, you can use the php function header( 'Location: http://www.lpokc.org/mobi/contact.php' ) ; to "refresh" the page. It's actually just a redirect command, but if you are sending them back to the page they are on, it is pretty much the same thing as a refresh.
It was a conflicting issue with my menu JS/CSS. I pulled it and now everything works fine.
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 having a big big problem with adsense, no matter what I do the adsense result iframe is loading inside other iframe. I´m using WordPress + Bootstrap Framework.
This particular site has two different ads, first use an adserver service which give me his own script, this script is placed in the header.php inside of a <div id="top-space"> and the adserver handle with the script to show an <iframe> and inside that iframe the objet flash of the banner.
The adsense code is in the sidebar and to place it I use a text wodget, put the code there and that´s it.
In 60% of the times the site loads in the correct position each banners, the adserver banners are in the top and adsense ads in the sidebar.
BUT! randomly the adsense iframe is loading inside of the adserver iframe. I tried to use this solution but don´t work at all.
I´m desesperate because my client is loosing money, the site don´t show the right ads, and some times adsense iframe push adserver ads so the site looks crappy.
Even I try to use adrotate wordpress plugin thinking that help me avoid this bug, but nothing.
This sounds like it could be a caching problem. I've noticed in the past, iframes usually don't refresh unless you specifically right-click and refresh each individual one. If you're running any WordPress caching, clear that, then your browser cache, or try an incognito window.
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