PDA

View Full Version : Fixed height index window

jimlad
03-31-2007, 09:42 AM
I want to control the height of an index page window when it loads.

If you look at this page;

http://www.farrowdesign.com/

It has a fixed size onload.

I'm trying to do a basic web page for a friend using dreamweaver.
see here http://www.landscapesbyjonstollar.com/

It's a series of horizontal landscape images which are all of the same height - I want the user to scroll to the right to view them usiing their browsers scroll bar.

Can anyone clearly explain (I'm new to this) how I might do this and if it's javascript - where I should paste the code.

Thanks in advance

Jim
tpeck
03-31-2007, 10:07 AM
Don't know if I'm going to be much help, but examining the .html code it seems this is done with css - emanating from the Adobe GoLive JavaScript Library.

It's a neat idea. I have often wondered why the web is so vertically fixated. Sometimes I'd prefer it if you could scroll and leap east and westwards as a matter of course.

So, I suppose I would examine the possibilities of Go Live.
jimlad
03-31-2007, 05:56 PM
Thanks for the reply tpeck, unfortunately I haven't got a copy of go live, (I'm still trying to get to grips with dreamweaver) can anyone who has, confirm whether this is a js from the library? Or better still, suggest a script that I can paste into the html code. All I need is to control the height of the window not the width.

Thanks
tpeck
03-31-2007, 08:28 PM
I fiddled around a bit with the Go Live script but eventually junked it and simply ended up with this:

[CODE]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Document</title>
</head>

<body bgcolor="#ffffff" leftmargin="0" marginheight="0" marginwidth="0" topmargin="0">

<table width="3000" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><img src="images/Stollar_01.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_03.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_05.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_07.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_09.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_11.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_13.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_15.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_17.jpg" width="1152" height="738"></td>
<td><img src="images/Stollar_19.jpg" width="1152" height="738"></td>
</tr>
</table>

</body>

</html>[CODE]

It's laughably close to what you already have, but seems to me to do practically everything that the farrowdesign page does except the randomness.

Maybe it all depends on making those jpgs the uniform height and width above?
jimlad
04-01-2007, 09:32 AM
cheers tpeck.

forgive me if I'm missing something but how does this address the window height problem?

thanks for your help.
tpeck
04-01-2007, 10:00 AM
Oh, it's me that's probably missing something - but did you try it?

It looks pretty much like the farrowdesign page you referred us to - in fact, I can't tell the difference.

I tested it various resolutions.

I don't know why you need to fix the window height unless you are asking to make it impossible for the user to alter it. Don't think that can be done.

Sorry if I've got you wrong!
tpeck
04-01-2007, 10:04 AM
Maybe something like this is what you mean:


<script>
function SetSize(){
window.resizeTo(836,600);
top.window.moveTo((screen.availWidth/2)-418,(screen.availHeight/2)-300);
}
</script>
</head>

<body onLoad="SetSize();">
tpeck
04-03-2007, 01:36 AM
Hi. Your eventual answer to the problem is neat and useful, but it doesn't center the window as my suggestion does. That is, it doesn't always guarantee a bang on display if the browser was off screen in the first place. Still, you might not want to be that coercive.

Anyhow, thanks for your solution - I can use it elsewhere too!
jimlad
04-06-2007, 02:46 AM
Hi Tpeck, just seen this - thanks a lot.

I managed in the end to find a script which resizes based on the white 'client area' rather than the external window size. It also takes into consideration different browser behaviours (for instance differing scroll bar sizes) and compensates accordingly. However it's still not quite what I want.

I want to specify the height (based on client area) and to expand the window to the available width of the monitor/resolution.
So I tried your available width script like this;

<script src="resizing_window.js">
</script>
</head>
<body onLoad="resizingWindowLoaded(screen.availWidth, 682);
top.window.moveTo((screen.availWidth/2)-418,(screen.availHeight/2)-600);
}"
onResize="resizingWindowResized()">

It works in Firefox and Camino but not in Safari (All on Mac) JS is enabled in Safari and Safari is a fairly popular browser for Macs. I haven't tested on IE.
(Obviously if I can get it all working on a Mac I'll test on PC)

Any idea why this doesn't doesn't work in Safari?

cheers

Jim


Maybe something like this is what you mean:


<script>
function SetSize(){
window.resizeTo(836,600);
top.window.moveTo((screen.availWidth/2)-418,(screen.availHeight/2)-300);
}
</script>
</head>

<body onLoad="SetSize();">