homepage Welcome to WebmasterWorld Guest from 54.163.72.86
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
a div which cover all page even if its scroll bar is visible
aftab82




msg:4127229
 9:49 am on May 5, 2010 (gmt 0)



document.getElementById("backdiv").style.width = "100%";
document.getElementById("backdiv").style.height = document.getElementById("footerdiv").offsetParent.offsetTop+"px";


footerdiv : is placed inside a table column.....so the offset parent will be the approx total height of the page............


backdiv : which will cover all the page contents to put something over it ...e.g

a feedback form.....update request occuring.......

 

tedster




msg:4127377
 2:20 pm on May 5, 2010 (gmt 0)

Welcome to the forums, aftab82. I'm not sure I understand you correctly - does this create something like a lightbox that covers the entire screen?

aftab82




msg:4128024
 7:30 am on May 6, 2010 (gmt 0)

thanks tedster.......
yea something like this........

for e.g visit
[foursquare.com...] and click on feedback tab on right .........

you will see a layer and the background get locked .......

this can be achieve by setting div height and width to 100% and setting its position absolute and z-index heigher than all controls except the layer which will be displaying over it.......

but there is one problem which occur when the page shows a scoll bar because of contents ........in that case 100% height will not make whole page area including scrolling area to be locked.....so the solution is to get the offset top of an control(e.g div) which is at the footer..........

..........

tedster




msg:4128307
 6:31 pm on May 6, 2010 (gmt 0)

We don't usually allow links to example sites - but I'll make an exception since foursquare is such a monster website and very well known. Yes, that is what I was calling a lightbox effect.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved