Hello everyone,

I have a site which uses YUI to build a drop down menu system. There are two pages in this site that have embedded .pdf files in them. When one of the pages with the .pdf is open the drop down menu goes behind the .pdf and you cannot see the menu options. I have tried using <embed>, <object>, and <iframe> with the same results. I tried to wrap it in a <div> tag and adjust the z-index with no luck, either.

The site uses php includes to load the pdf. Here is that bit of code:

<?php include_once("../includes/menu.php"); ?>
		<!-- menu ends -->
        <!-- start content -->
        <br /><br />
        <div align="center">
	        <embed src="../images/classes/<?php echo $Array[0]; ?>" width="1000px" height="1000px" />
		</div>
        <!-- end content --><br /><br />
        <!-- begin footer -->
        <?php include_once("../includes/footer.php"); ?>

This does not seem to be an issue in firefox, but it is in explorer, chrome, opera, and safari.

Here is a link to the site. Everything else works great except for this one issue.

Thanks for any help you can give.

i think that it has to be adjusted with your z-index. when you set your z-index, make sure that you have a position tag in your class as that could also be the reason for it not taking effect, and make sure that your navigation index is higher than the pdf as well.

Member Avatar for diafol

Sorry, was going to suggest wmode="transparent", but didn't work

Member Avatar for rajarajan2017

wmode="transparent" will work if you embeded the flash object
zindex will work on webpage, so I think zindex will work. but I have no idea for the implementation

Member Avatar for diafol

wmode="transparent" will work if you embeded the flash object
zindex will work on webpage, so I think zindex will work. but I have no idea for the implementation

Yes, I've used wmode on video players in the past, and thought it would work for general object and embed tags. Sadly not the case.

Also tried the z-index, but couldn't get it to work.

Hello everyone,

I have a site which uses YUI to build a drop down menu system. There are two pages in this site that have embedded .pdf files in them. When one of the pages with the .pdf is open the drop down menu goes behind the .pdf and you cannot see the menu options. I have tried using <embed>, <object>, and <iframe> with the same results. I tried to wrap it in a <div> tag and adjust the z-index with no luck, either.

The site uses php includes to load the pdf. Here is that bit of code:

<?php include_once("../includes/menu.php"); ?>
		<!-- menu ends -->
        <!-- start content -->
        <br /><br />
        <div align="center">
	        <embed src="../images/classes/<?php echo $Array[0]; ?>" width="1000px" height="1000px" />
		</div>
        <!-- end content --><br /><br />
        <!-- begin footer -->
        <?php include_once("../includes/footer.php"); ?>

This does not seem to be an issue in firefox, but it is in explorer, chrome, opera, and safari.

Here is a link to the site. Everything else works great except for this one issue.

Thanks for any help you can give.

I Checked your site in IE and it works perfectly fine.. I didn't find any issue.

If you set Z-index of your pdf file object to lower than Z-index of your menu, it will surely work. Set your menu Z-index value to higher value like 9999 and check it out.

I would also suggest to check out the positioning (relative/absolute) of menu and pdf object. I'd same issue with one of the site I developed.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.