/    Sign up×
Community /Pin to ProfileBookmark

HELP! Embedded PDF overlays SPRY nav bar

Copy linkTweet thisAlerts:
Jan 25.2010

I have the following code to embed a PDF into a basic HTML page:

<object class=”stack” type=”application/pdf” data=”documents/qualifytimes.pdf” width=”917″ height=”700″ >
<a> Click <a href=”documents/qualifytimes.pdf” class=”menu”> here</a> to view the file in its own window.</a>
</object>

This part works fine in both IE and FF. The problem is that it won’t allow the drop-down spry nav bar to show over it, even with z-index set to a negative value.
Any idea how I can get it to go to the background? I’ve used the object tag before for other types of documents and never had this problem.
Thanks!

to post a comment
HTML

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@NBarleyauthorJan 26.2010 — You can see the problem in action here:

http://www.woodlandsswimteam.org/qual_times.php

The drop-down menu for the team info section has several more items that aren't being displayed.
Copy linkTweet thisAlerts:
@Eye_for_VideoJan 26.2010 — Well remember that z-indexing only works with elements that have a declared position, and how that positioning works is directly related to whether or not it's parent element also has a declared position.

From an older post:

The thing missing from your positioning is that unless the parent element also has a declared position, the child will do 1 of 2 things.

If position:relative, it will position as desired but space will be left as though that element was still in the natural flow. So you may move the 500 X 100 element down and over, but a 500 X 100 space will be left, as though it was still there.

If position:absolute, child is positioned relative to browser window and that position does not change even if window contracts or expands.

More on z-index:

http://www.w3schools.com/Css/pr_pos_z-index.asp

Do the layout without the pdf in place (with declared position and z-indexing), just use a bright background color in place of pdf. Get the menu to display over the <div> correctly before you add the pdf content.

Not sure if you are part of the swim team or you just do work for them... but as a former age-group swim coach... I wish your Team the best!

Attached is photo of my son presenting our Team Tee shirt to Ian Crocker (holder of the only World record Michael Phelps did not break during last summer Olympics). We also presented Michael Phelps with our Team photo and Tee shirt at the same event.

Anyway, hope some of this info is helpful.

Best wishes,

Eye for Video

www.cidigitalmedia.com

[upl-file uuid=d4035310-33f7-4977-b059-337d605364c1 size=82kB]mike_ian.jpg[/upl-file]
Copy linkTweet thisAlerts:
@FangJan 26.2010 — The pdf is an application so will always appear on top of all other elements.

I haven't seen a working solution to this problem, although having the menu and the pdf in separate iframes is supposed to be a solution.

http://support.microsoft.com/default.aspx?scid=kb;en-us;177378
×

Success!

Help @NBarley spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...