Facebook Javascript SDK's FB.ui Bug in IE8
Posted
by Lukas
on Stack Overflow
See other posts from Stack Overflow
or by Lukas
Published on 2010-05-20T08:42:27Z
Indexed on
2010/05/20
9:10 UTC
Read the original article
Hit count: 941
hi everyone
i have found a bug in IE8 using the new Facebook Javascript SDK.
i call a Post dialog using:
FB.ui(
{
method: 'stream.publish',
display: 'dialog',
message: 'test',
attachment: {
name: 'test',
caption: 'test',
media: [
{type: 'image', src: site_url+'test.jpg', href: site_url}
],
description: (
'test'
),
href: site_url
}
},
my html structure is:
<body>
<div id="content"></div>
<script type="text/javascript">
var params = {
wmode: 'opaque',
allowScriptAccess: 'always',
quality: 'high',
allowFullScreen: "true"
};
var attributes = {
id: 'test'
};
swfobject.embedSWF("frontend/swf/stage.swf", "content", "100%", "100%", "10", params, attributes);
var site_url = 'http://test.com';
</script>
<div id="fb-root"></div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<div id="like-dialog" style="display:none;">
<div id="like-dialog-wrapper">
<div id="like-dialog-close"></div>
<iframe src="http://www.facebook.com/plugins/likebox.php?id=99999999999&width=292&connections=0&stream=true&header=false&height=395" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:395px;"></iframe>
</div>
</div>
</body>
the css:
html, #content, body {
margin: 0;
height: 100%;
overflow: hidden;
}
#content {
z-index: 1;
}
what i do is:
i embed my stage
i call the FB.init function and then call FB.ui function to overlay my flash.
it works in every common browser except IE8.
in IE8 the div containing the iframe is behind the div where i embed flash, although i set the z-index and position the dialog absolute.
any ideas?
thanks in advance
© Stack Overflow or respective owner
