Solved

Dynamically size a grid based on availabe screen height

Posted on 2011-02-19
2
423 Views
Last Modified: 2012-05-11
I am using Masterpage and contentpages... on the content pages I have a header and a middle section and I have a grid on the bottom.

I want to size that grid so it takes up the rest of the available space on the screen... in old vb it would be something like Screen.height - grid.top = grid.height.

Thank you!
0
Comment
Question by:md0333
2 Comments
 
LVL 14

Accepted Solution

by:
CtrlAltDl earned 500 total points
ID: 34946550
You want to use some JavaScript client-side scripting, so it can be calculated correctly for their particular browser.

In my script below it assumes you have a header div and a footer div.  It subtracts the header and footer from the browsers available view space and resizes your grid (myGrid) to the available space.

<script type="text/javascript">
function resizeContent() {
     //Get/Set your available height
     var availHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
     var footerHeight = document.getElementById("footerDiv").offsetHeight;
     var headerHeight = document.getElementById("headerDiv").offsetHeight;
     
     availHeight = footerHeight - headerHeight - availHeight;
     
     document.getElementById("myGrid").setAttribute("height", availHeight);
</script>

Open in new window

0
 

Author Comment

by:md0333
ID: 34948679
Thank you!
0

Featured Post

Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses the ASP.NET AJAX ModalPopupExtender control. In this article we will show how to use the ModalPopupExtender control, how to display/show/call the ASP.NET AJAX ModalPopupExtender control from javascript, how to show/display/cal…
Problem Hi all,    While many today have fast Internet connection, there are many still who do not, or are connecting through devices with a slower connect, so light web pages and fast load times are still popular.    If your ASP.NET page …
Internet Business Fax to Email Made Easy - With eFax Corporate (http://www.enterprise.efax.com), you'll receive a dedicated online fax number, which is used the same way as a typical analog fax number. You'll receive secure faxes in your email, fr…
Two types of users will appreciate AOMEI Backupper Pro: 1 - Those with PCIe drives (and haven't found cloning software that works on them). 2 - Those who want a fast clone of their boot drive (no re-boots needed) and it can clone your drive wh…

813 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

8 Experts available now in Live!

Get 1:1 Help Now