Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

auto-size of site page to the viewers browser window size 1

Status
Not open for further replies.
JerJag

JerJag

Technical User
Joined
Jun 27, 2005
Messages
6
Location
US
I'm interested if there is a way to have a site automatically
adjust and fill the the viewers browser window. I think I've seen this before and tried to find how this is done in the code.

I review another site that this seems to happen and saw this
in the code.
<table BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="100%" HEIGHT="100%"><tr>

Is this possible? Can it be done with a page built with multiple frames or a single table. I can't find anything about htis in the DW documentation.
Thanks for your help.
Jerdog
 
Sort by date Sort by votes
one way would be:

:--------------------------------------------------------------------------:
fugitive.gif

All around in my home town,
They tryin' to track me down...
 
Upvote 0 Downvote
If you just want to fill the window then Lebisol has answered. If you wish to fill the entire screen then you will need to add a javascript function like this
Code: 
<script>
function resizeWindow(){
window.resizeTo(screen.width,screen.height);
self.moveTo(0,0);
}
</script>
Then just call the function onLoad or whatever

Cheech

[Peace][Pipe]
 
Upvote 0 Downvote
Lebisol oh great wise one, I bow before you.
Your suggestions was just what I needed.

This presents a new challenge.
When I reduce the window size enough to create a scroll bar at bottom, when I scroll to the right, the two tables (banner and nav bar)right edge don't line up, with the nav bar being a few pixels wider. (I checked both tables and they both include elements that have same width measurements with one cell that is autostretch)

Also, when I scroll to the right, the art doesn't autostretch after the window is reduced horizontally, showing a background color (white), even though the art below may still stretch right.
Any further help is much appreciated.

As I wait for your reply, we will gather up some village virgins and throw them into the volcano to appease you.

thanks (just kidding about the virgins and molten lava)

JerJag
 
Upvote 0 Downvote
keep the molten lava out it :)
if u have some code or better yet a link it would help to see what is going on. Perhaps img position in relation to the cell/table could be causing it...post some more.
All the best!

:--------------------------------------------------------------------------:
fugitive.gif

All around in my home town,
They tryin' to track me down...
 
Upvote 0 Downvote
Lebisol, many thanks. The virgins of my village are very relieved that you don't need a sacrifice to secure your help.

My nav bar is about 3 pixels wider from the above banner table

Being a designer, I work more in the Design mode rather than the code view (kind of like speaking English with a bad french accent in France) so I hope this is enough code to check:

</script>
</head>

<body bgcolor="#FFFFFF" text="#000000" onLoad="MM_preloadImages('JP_Assets/Nav_profile2.gif','JP_Assets/Nav_portfolio2.gif','JP_Assets/Nav_available2.gif','JP_Assets/Nav_contact2.gif')" leftmargin="0" topmargin="0">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="150" valign="top" height="100" bgcolor="#000066"><img src="JP_Assets/JP_logo_white.gif" width="250" height="100"></td>
<td width="100%" valign="top" bgcolor="#000066"><a name="Page_top"></a></td>
<td width="473" valign="top" bgcolor="#000066" align="right"><img src="JP_Assets/header_spacer.gif" width="473" height="100"></td>
<td width="70"></td>
</tr>
</table>
<map name="Map">
<area shape="rect" coords="65,7,173,20" href="profile.html" target="_self">
<area shape="rect" coords="188,8,256,20" href="portfolio_frame.html" target="_self">
<area shape="rect" coords="268,8,334,20" href="available.html" target="_self">
<area shape="rect" coords="346,8,428,20" href="contact.html" target="_self">
<area shape="rect" coords="8,7,51,20" href="index.html" target="_self">
</map>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="204" height="23" valign="top" bgcolor="#000066"><img src="JP_Assets/logo_colorspace.gif" width="250" height="23"></td>
<td width="100%" valign="top" bgcolor="#000066">&nbsp;</td>
<td width="366"></td>
<td width="151" valign="top" bgcolor="#000066"><a href="profile.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Nav_profile','','JP_Assets/Nav_profile2.gif',1)"><img name="Nav_profile" border="0" src="JP_Assets/Nav_profile1.gif" width="150" height="23"></a></td>
<td width="104" valign="top" bgcolor="#000066"><a href="portfolio_frame.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('portfolio','','JP_Assets/Nav_portfolio2.gif',1)"><img name="portfolio" border="0" src="JP_Assets/Nav_portfolio1.gif" width="104" height="23"></a></td>
<td width="104" valign="top" bgcolor="#000066"><a href="available.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('available','','JP_Assets/Nav_available2.gif',1)"><img name="available" border="0" src="JP_Assets/Nav_available1.gif" width="104" height="23"></a></td>
<td width="130" valign="top" bgcolor="#000066"><a href="contact.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('contact_us','','JP_Assets/Nav_contact2.gif',1)"><img name="contact_us" border="0" src="JP_Assets/Nav_contact1.gif" width="115" height="23"></a></td>
<td width="121"></td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="288" height="60" valign="top"><img src="JP_Assets/spacer_left.gif" width="288" height="60"></td>
<td width="100%" valign="top"><img src="JP_Assets/spacer_right.gif" width="432" height="60"></td>
<td width="138"></td>
</tr>
</table
 
Upvote 0 Downvote
In the link that was posted the only columns with values set for the width were the balloon columns (100%) but in your code you have pixel values set on the other columns all over the place. That will cause grief as was mentioned in the posted example site because you are mixing pixel and percentage widths within a single table. I notice you also have height values set in some places, and I know for certain that I have experienced problems with that. So what you might want to do is:
1. Select each table in turn in Dreamweaver
2. In the Properties tool click the buttons to remove column widths and row heights from the table
3. Go back and set the 100% column width on only the desired table cells.

NOTE: Dreamweaver will put in these widths etc for you if you are dragging border edges in the design view of your tables. The idea of the example that was posted should remove any need for adjusted the columns by dragging them etc.

I hope this helps!

Crystal
--------------------------------------------------

Experience is one thing you can't get for nothing.

-Oscar Wilde

 
Upvote 0 Downvote
Just a reminder...

Not everyones desktop resolution is the same, So if you designed the site at say 1024x768, and a user opens the page with 800x600 res, they wont see the entire page without having to scroll around.

AccessGuruCarl
Programmers helping programmers
you can't find a better site.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

cohan123
  • Locked
  • Question Question
page layout-&gt;page size, optimal for web
Replies
0
Views
733
cohan123
cohan123
Mark Freeberg
  • Locked
  • Question Question
Most Recent Version of DW w/ (true) WYSIWYG?
Replies
2
Views
843
Mark Freeberg
Mark Freeberg
RosieGp
  • Locked
  • Question Question
How to read string of 0s and 1s
Replies
3
Views
991
LyndonOHRC
LyndonOHRC
fdgsogc
  • Locked
  • Question Question
Displaying results of an SQL Pivot Query
Replies
1
Views
841
jdhilljr
jdhilljr
Mike Lewis
  • Locked
  • Question Question
Using Dreamweaver to maintain a site not created in Dreamweaver
Replies
2
Views
983
Mike Lewis
Mike Lewis

Part and Inventory Search

Sponsor

Back
Top