How to hide iframe with FB Like button on click?
I'm using this code (standard FB Like):
<div id="like"><iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fexample.com%2Fpage%2Fto%2Flike&layout=standard&show_faces=true&width=450&action=like&colorscheme=light&height=80" scrolling="no" frameborde开发者_StackOverflow社区r="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe></div>
I need to hide the complete div
(or iframe
) when the user clicks on it.
I tried the onclick
event but it didn't work inside iframe
.
How can I do this?
You could do something like this:
HTML:
<div id="like"><iframe id="facebookFrame" src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fexample.com%2Fpage%2Fto%2Flike&layout=standard&show_faces=true&width=450&action=like&colorscheme=light&height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe></div>
Javascript:
document.getElementById('facebookFrame').contentWindow.document.body.onclick =
function() {
// hide your iframe here or do whatever
document.getElementById('facebookFrame').style.display = "none";
alert("iframe was clicked");
}
I havent done it yet. Just found a good resource http://softwareas.com/cross-domain-communication-with-iframes
maybe like that
parent.frames[1].location.href -> set to own url plus #anyanchor
so it wont be reloaded, then access the js function of main window
document.getElementById('facebookFrame').style.display = "none";
Realistically I think that your best bet is to place another, this time transparent, div
over the iframe
. Set your click handler on that.
You can also try this solution:
FB.Event.subscribe('edge.create', function(href, widget) {
your call back function to hide the iframe
});
精彩评论