Embedded PDF overlapping menu in FireFox

Question

I'm pretty much at my wits end with this issue. I've been searching for a while and though I find many posts with people having the same issue as me, I'm not finding any answers or solutions to these posts.

The problem is this: We have a PDF viewer embedded on a report site. The user has the option to view the PDF in the browswer or to download it. We have a dropdown menu so the user can navigate to different reprots. The menu overlaps the PDF viewer when it drops down. In IE, it goes over the PDF viewer, as it should. In FireFox it goes behind the viewer and gets cut off.

Here is a code snipit:

<div style="position: relative; height: 347px; z-index: 1;" id="divPDF">
<span style="width: 100%; height: 100%;" id="PDFViewer1">
 <div>
  <object width="100%" height="100%" type="application/pdf" data="report.pdf#toolbar=1&amp;navpanes=0&amp;scrollbar=1&amp;view=FitH">
   <param name="wmode" value="opaque" />
   <embed src="report.pdf#toolbar=1&amp;navpanes=0&amp;scrollbar=1&amp;view=FitH" type="application/pdf" width="100%" height="100%" wmode="opaque"></embed> 
   <a href="report.pdf">Download PDF</a>
  </object>
 </div>
</span>  </div>

I have tried putting it in an iframe, but that didn't work. I've tried setting the vmode to transparent, but that didn't work either. (Is vmode even a valid param?) The z-index for the menu is 500.

Any suggestions would be greatly appreciated.

Thanks in advance.

Answer 1

Have you check in Firebug at all instances that the z-index of your menu and pdf containers remain constant? When I say instances I mean when the user interacts with the menu and whatnot.

Or perhaps it's a CSS overflow issue? Just throwing things out.

Answer 2

This is known issue with the 'embed' html tag & the way the adobe pdf renders the pdf . Currently Adobe does not support transparency tags like the flash files do ( wmode=transparent) kind of thing in the PDF rendering.

Answer 3

Hi, I have the exact same issue. Except on my site Firefox works fine and IE the menu goes behind the pdf. However on other machines it seems to be the other way around. Look here: http://www.loanburger.com/CapeEpic.aspx

Please let me know if you have found a solution. contact me at loan.burger at gmail dot com.

Thanks.