views:

701

answers:

1

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"&gt;&lt;/script&gt;
  <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&amp;amp;width=292&amp;amp;connections=0&amp;amp;stream=true&amp;amp;header=false&amp;amp;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:

  1. i embed my stage

  2. 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

A: 

Set wmode to transparent.

Sean Kinsey
i already tried that.actually i kinda resolved my problem by switching to html5. i haven't got a clue what the problem was...
Lukas