iframe in salesforce modal pop up, entire page greys out - popup

CSS Modal window and iFrame
I am using the code in the above link to show modal pop up in salesforce. When i put Iframe in the modal pop-up the entire page greys out. Any idea what needs to be corrected?

Could you replace
<apex:page controller="tstpopup">
with
<apex:page controller="tstpopup" showHeader="false">
This should help when rendering in an iFrame.
I hope this helps. Cheers.

Related

Facebook like button display under content- squarespace

Im trying to add a facebook like button to my website, however when you click the like button, the share bubble appears under the content.
Im using facebook´s HTML5 button on squarespace
You can see the problem here, at the bottom of the page
http://mindarin.com/
The share bubble appears under the logo, it happens everywhere though, if I place the button where I want to ( top of page ) the bubble appears behind the main image.
Thanks!
You can hide the share tooltip by adding overflow:hidden;height: 21px; to fb-like widget css.
<div style="overflow:hidden;height: 21px;" class="fb-like" [...] />

facebook login buttons in fancybox load correctly first time only

I'm adding facebook login buttons to fancybox (version 1.3.4) modals (one for join, one for login). The facebook buttons all get instantiated when the page loads, but are hidden. After triggering the fancybox login modal, the facebook buttons get rewritten in the modal and load correctly the first time. However if you close the modal and then reload it a second or third time, there is no facebook login button. It's just blank. When I look at the inline html block
that fancybox based the modal on, the facebook button markup that was generated when the page initially loaded is gone...actually not completely gone, but the button code deep in the iframe is wiped out.
I've seen suggestions to iframe these facebook buttons, so I tried adding an iframe instead of the raw facebook button markup. Note that I am not using the iframe fancybox type and I can't currently do that. When I include <iframe src="/myfacebookbuttonpage"></iframe> in the modal section, again it loads correctly the first time and then after closing the modal, looking at the source I can see the iframe rewritten as <iframe src="about:blank"></iframe> and the innards of the iframe are blank.
Anyone have any idea what's going on here? Or is this attempt to include facebook login buttons in fancybox modals completely wrong for some reason?
It's a bug in fancybox v1.3.2+ when using inline iframes.
As a work around, you may edit the fancybox js file or apply the workaround in your custom fancybox script.
Go here for further instructions

Facebook Like and share Iframe are beneath the content

I have the following site, I just added the facebook like button, but after clicking on the like button, the iframe will appear beneath the content. I also added the google share and that is working fine. What can be the problem with the like/send buton?
Perhaps it is because in your CSS, you have overflow:hidden in your #maincolumn_middle. It will hide any elements within it, including the pop-up iframe window. Removing the overflow:hidden would show it.

Resize iFrame in facebook fan page

I want resize the iframe height of my tab page. I am trying FB.Canvas.SetSize method, also I try with jQuery and javascript resize the iframe but don´t work.
My application is not a Canvas.It is a tab page so i think "FB.Canvas method should not work with tab page".
How could resize my tab page on facebook profile?
How could drop the iFrame scrollbars on tab page?
Excuse me I also need to know if I could modify the share button with a custom image.
Thanks in advance
Provide some code
Make sure you have the Canvas Height option is set to Settable under the App Advanced Settings
Use asynchronous Loading of your JS-SDK and put your FB.Canvas.setSize(); inside the fbAsyncInit function
Please note that the fbAsyncInit function may fire (and hence your FB.Canvas.setSize();) before all images of your page are loaded! which means actual height of page is not reached yet!

JQTouch animation flicker

I have been working a JQTouch app. The functionalitly is correct however my animations on some menu items flicker, especially when you click a back link. The strange thing is it is only on certain menu items.
All pages are loaded in the same way via AJAX.
Can anyone shed any light on this?
site can be viewed at:
http://www.alliancerail.co.uk/ip/iphone.html
Thanks
Chris
I think you have an extra closing </div> that appears after "about" and right before "gnwr." Not sure if this will end up fixing your flicker problem...
You are loading content dynamically. Sometimes the jqt animates to the new page before that page has content. Try including more content in index.html such as the about or contact pages. You can also write your own ajax routines that get fired from onClick events bound to the anchor tag on your home page.
The goog group is a great resource -> https://groups.google.com/forum/#!forum/jqtouch