Quick fix...plz help

Printable View

11-14-2000, 12:35 PM
Brad Overlund

Quick fix...plz help

I am writing up this page and tryin some new stuff. I have 4 "windows" (floating
divs) that are all moveable and hideable/showable ... I want to make a minimize
button and a maximize button. When clicked (minimize) the floating div layer
will resize height to 25, and when maxed back to 150. sounds simple, but
i cant get them to resize.
heres the code: *note the div tags for the floating windows are wrapped
around a table.
function maxWinsA() {

if (navigator.appName == "Netscape") {
document.layers["LYRtopIssuesA"].height = "150";
} else {
document.all.LYRtopIssuesA.style.height = "150";
}
}

function minWinA() {

if (navigator.appName == "Netscape") {
document.layers["LYRtopIssuesA"].height = "25";
} else {
document.all.LYRtopIssuesA.style.height = "25";
}
}

and then up in the div window i have &qout<a href="javascript:maxWinA();">[_]</a>
and &qout<a href="javascript:minWinA();">_</a>&qout;

Thanks in advance
-Brad
11-14-2000, 07:27 PM
Friendly Poster

Re: Quick fix...plz help

Brad,

On IE4 I just got your code to work okay (with one minor change), and suspect
that your code will work for a "position: relative" div on IE4.

The only change I made was to correct the spelling of the function named
maxWinsA() to maxWinxA() .

I suspect that you may have had a problem defining the div.
Its format can get tricky because for one thing it lets
you continue the style quote across lines but sometimes
gets fussy about it.

I did not do a NSnav test yet.

Compare this whole webpage with yours:

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<html><head>
<script language="javascript">

function maxWinxA() {
if (navigator.appName == "Netscape") {
document.layers["LYRtopIssuesA"].height = "450";
} else {
document.all.LYRtopIssuesA.style.height = "450";
}
}

function minWinxA() {
if (navigator.appName == "Netscape") {
document.layers["LYRtopIssuesA"].height = "45";
} else {
document.all.LYRtopIssuesA.style.height = "45";
}
}

</script>

<body bgcolor=yellow>

<div id="LYRtopIssuesA"
style="position: relative; width: 100%; font: 10pt Verdana;
height: 270; overflow: scroll; padding: 3;
border: 1px solid black; background-color: #FFFFFF; ">

<a href="javascript:maxWinxA();">MAX[_]</a>

<a href="javascript:minWinxA();">MIN_</a>

</div>

<body>
<html>

"Brad Overlund" <boverlund@psigen.com> wrote:
>
>I am writing up this page and tryin some new stuff. I have 4 "windows"
(floating
>divs) that are all moveable and hideable/showable ... I want to make a minimize
>button and a maximize button. When clicked (minimize) the floating div
layer
>will resize height to 25, and when maxed back to 150. sounds simple, but
>i cant get them to resize.
>heres the code: *note the div tags for the floating windows are wrapped
>around a table.
>function maxWinsA() {
>
> if (navigator.appName == "Netscape") {
> document.layers["LYRtopIssuesA"].height = "150";
> } else {
> document.all.LYRtopIssuesA.style.height = "150";
> }
>}
>
>function minWinA() {
>
> if (navigator.appName == "Netscape") {
> document.layers["LYRtopIssuesA"].height = "25";
> } else {
> document.all.LYRtopIssuesA.style.height = "25";
> }
>}
>
>and then up in the div window i have &qout<a href="javascript:maxWinA();">[_]</a>
>and &qout<a href="javascript:minWinA();">_</a>&qout;
>
>Thanks in advance
>-Brad
11-14-2000, 07:35 PM
Friendly Poster

Re: Quick fix...plz help

Brad, All I have is Netscape 4.08 here (and it doesnt work
for this dynamic page).

I'll try a more current Netscape when I find one.

By the way I changed both your function names to an x-version
for no reason. The extra s is all I had to remove from the
function to make it match your a-href-links.

Hope this helps.

"Friendly Poster" <onevoice@post.com> wrote:
>
>Brad,
>
>On IE4 I just got your code to work okay (with one minor change), and suspect
>that your code will work for a "position: relative" div on IE4.
>
>The only change I made was to correct the spelling of the function named
>maxWinsA() to maxWinxA() .
>
>I suspect that you may have had a problem defining the div.
>Its format can get tricky because for one thing it lets
>you continue the style quote across lines but sometimes
>gets fussy about it.
>
>I did not do a NSnav test yet.
>
>
>Compare this whole webpage with yours:
>
>~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
><html><head>
><script language="javascript">
>
>function maxWinxA() {
> if (navigator.appName == "Netscape") {
> document.layers["LYRtopIssuesA"].height = "450";
> } else {
> document.all.LYRtopIssuesA.style.height = "450";
> }
>}
>
>function minWinxA() {
> if (navigator.appName == "Netscape") {
> document.layers["LYRtopIssuesA"].height = "45";
> } else {
> document.all.LYRtopIssuesA.style.height = "45";
> }
>}
>
></script>
>
><body bgcolor=yellow>
>
><div id="LYRtopIssuesA"
> style="position: relative; width: 100%; font: 10pt Verdana;
> height: 270; overflow: scroll; padding: 3;
> border: 1px solid black; background-color: #FFFFFF; ">
>
>
><a href="javascript:maxWinxA();">MAX[_]</a>
>
><a href="javascript:minWinxA();">MIN_</a>
>
>
></div>
>
><body>
><html>
>
>
>
>
>
>
>"Brad Overlund" <boverlund@psigen.com> wrote:
>>
>>I am writing up this page and tryin some new stuff. I have 4 "windows"
>(floating
>>divs) that are all moveable and hideable/showable ... I want to make a
minimize
>>button and a maximize button. When clicked (minimize) the floating div
>layer
>>will resize height to 25, and when maxed back to 150. sounds simple, but
>>i cant get them to resize.
>>heres the code: *note the div tags for the floating windows are wrapped
>>around a table.
>>function maxWinsA() {
>>
>> if (navigator.appName == "Netscape") {
>> document.layers["LYRtopIssuesA"].height = "150";
>> } else {
>> document.all.LYRtopIssuesA.style.height = "150";
>> }
>>}
>>
>>function minWinA() {
>>
>> if (navigator.appName == "Netscape") {
>> document.layers["LYRtopIssuesA"].height = "25";
>> } else {
>> document.all.LYRtopIssuesA.style.height = "25";
>> }
>>}
>>
>>and then up in the div window i have &qout<a href="javascript:maxWinA();">[_]</a>
>>and &qout<a href="javascript:minWinA();">_</a>&qout;
>>
>>Thanks in advance
>>-Brad
>
11-14-2000, 09:22 PM
Friendly Poster

Re: Quick fix...plz help

Brad

I got a cross-browser version of a sorts working. It uses a hidden layer
in NS to present a second box/layer with a shorter height. IE just alters
the height of a single DIV and ignores the second box.

In NS as I have coded it, the content of the two LAYERs may be different
as well as the heights.

Here is the complete page. As usual, I wish I never heard of browser differences
and hope that somebody else can get NS at some level to simply alter the
dynamic rendering property: height.

Here we go:

<html><head>
<script language="javascript">

function maxWinxA() {
if (navigator.appName == "Netscape") {
document.layers["LYRtopIssuesA"].visibility = "show";
document.layers["LYRtopIssuesAs"].visibility = "hide";

} else {
document.all.LYRtopIssuesAb.style.height = "450";
}
}

function minWinxA() {
if (navigator.appName == "Netscape") {
document.layers["LYRtopIssuesA"].visibility = "hide";
document.layers["LYRtopIssuesAs"].visibility = "show";

} else {
document.all.LYRtopIssuesAb.style.height = "45";
}
}

function whenloaded() {
if (navigator.appName == "Netscape") {

} else {
document.all.LYRtopIssuesAbs.style.height = "0";
}

}
</script>

<body bgcolor=yellow onload="whenloaded();" >

<layer id="LYRtopIssuesA" visibility=show" height="250">
<div id="LYRtopIssuesAb"
style="background-color: #FFFFFF; height: 250; position: relative;
width: 800; font: 10pt Verdana; overflow: scroll; padding: 3; border: 1px
solid black;">

<a href="javascript:maxWinxA();">MAX[_]</a>

<a href="javascript:minWinxA();">MIN_</a>

<p>
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
This is the long story. It goes on and on for as long as we have space.
</p>
</div>
</layer>

<layer id="LYRtopIssuesAs" left="0" visibility="hide" height="45" >

<div id="LYRtopIssuesAbs"
style="background-color: #FFFFFF; height: 45; position: relative; width:
800; font: 10pt Verdana; overflow: scroll; padding: 3; border: 1px solid
black;">

<a href="javascript:maxWinxA();">MAXIMIZE[_]</a>

<a href="javascript:minWinxA();">MINIMIZE_</a>

<p>
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.
This is the short story. It stops soon.

</p>
</div>
</layer>

<body>
<html>

~~~~~~~~~~~~~~~~~~~~~~~end of page ~~~~~~~~~~~~~~

"Friendly Poster" <onevoice@post.com> wrote:
>
>Brad, All I have is Netscape 4.08 here (and it doesnt work
>for this dynamic page).
>
>I'll try a more current Netscape when I find one.
>
>By the way I changed both your function names to an x-version
>for no reason. The extra s is all I had to remove from the
>function to make it match your a-href-links.
>
>Hope this helps.
>
>"Friendly Poster" <onevoice@post.com> wrote:
>>
>>Brad,
>>
>>On IE4 I just got your code to work okay (with one minor change), and
suspect
>>that your code will work for a "position: relative" div on IE4.
>>
>>The only change I made was to correct the spelling of the function named
>>maxWinsA() to maxWinxA() .
>>
>>I suspect that you may have had a problem defining the div.
>>Its format can get tricky because for one thing it lets
>>you continue the style quote across lines but sometimes
>>gets fussy about it.
>>
>>I did not do a NSnav test yet.
>>
>>
>>Compare this whole webpage with yours:
>>
>>~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
>><html><head>
>><script language="javascript">
>>
>>function maxWinxA() {
>> if (navigator.appName == "Netscape") {
>> document.layers["LYRtopIssuesA"].height = "450";
>> } else {
>> document.all.LYRtopIssuesA.style.height = "450";
>> }
>>}
>>
>>function minWinxA() {
>> if (navigator.appName == "Netscape") {
>> document.layers["LYRtopIssuesA"].height = "45";
>> } else {
>> document.all.LYRtopIssuesA.style.height = "45";
>> }
>>}
>>
>></script>
>>
>><body bgcolor=yellow>
>>
>><div id="LYRtopIssuesA"
>> style="position: relative; width: 100%; font: 10pt Verdana;
>> height: 270; overflow: scroll; padding: 3;
>> border: 1px solid black; background-color: #FFFFFF; ">
>>
>>
>><a href="javascript:maxWinxA();">MAX[_]</a>
>>
>><a href="javascript:minWinxA();">MIN_</a>
>>
>>
>></div>
>>
>><body>
>><html>
>>
>>
>>
>>
>>
>>
>>"Brad Overlund" <boverlund@psigen.com> wrote:
>>>
>>>I am writing up this page and tryin some new stuff. I have 4 "windows"
>>(floating
>>>divs) that are all moveable and hideable/showable ... I want to make a
>minimize
>>>button and a maximize button. When clicked (minimize) the floating div
>>layer
>>>will resize height to 25, and when maxed back to 150. sounds simple,
but
>>>i cant get them to resize.
>>>heres the code: *note the div tags for the floating windows are wrapped
>>>around a table.
>>>function maxWinsA() {
>>>
>>> if (navigator.appName == "Netscape") {
>>> document.layers["LYRtopIssuesA"].height = "150";
>>> } else {
>>> document.all.LYRtopIssuesA.style.height = "150";
>>> }
>>>}
>>>
>>>function minWinA() {
>>>
>>> if (navigator.appName == "Netscape") {
>>> document.layers["LYRtopIssuesA"].height = "25";
>>> } else {
>>> document.all.LYRtopIssuesA.style.height = "25";
>>> }
>>>}
>>>
>>>and then up in the div window i have &qout<a href="javascript:maxWinA();">[_]</a>
>>>and &qout<a href="javascript:minWinA();">_</a>&qout;
>>>
>>>Thanks in advance
>>>-Brad
>>
>
11-15-2000, 12:51 PM
Patrick Steele

Re: Quick fix...plz help

In article <3a11f382$1@news.devx.com>, onevoice@post.com says...

> Here is the complete page. As usual, I wish I never heard of browser differences
> and hope that somebody else can get NS at some level to simply alter the
> dynamic rendering property: height.

NS will never be able to implement a lot of DHTML functionaliy in the
4.x browsers because the rendering engine is static -- it does not allow
for the page to "re-flow" when changes are made.

This is why we're seeing Netscape 6.x and not 5.x. Netscape was
planning on using the same (crappy) rendering engine for 5.x. Their
users found out about this and complained to the point that Netscape
scraped the whole thing and started a brand new rendering engine.

So even though it's Netscape 6.0, it's a version 1.0 browser.

--
Patrick Steele
(patrick@neovisionsystems.com)
http://www.neovisionsystems.com
Microsoft MCP