Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

Javascript in netscape navigator

0 views
Skip to first unread message

Sangwoo Im

unread,
Dec 6, 2003, 11:24:15 PM12/6/03
to
Please take a look at my code. I made a script to scroll the contents of DIV
tag. It works in IE, but not NN. I tried to use document.getElementById(id)
function. It didn't work at all. I just want it to run in NN7.1 which is
latest. Thank you in advance.

<HTML>
<HEAD>
<TITLE>TEST</TITLE>
<SCRIPT LANGUAGE="Javascript">
<!--
var div1interval;
function div1init()
{
for(j=0; j<2;j++)
{
div1.innerHTML += 1+"<BR>";
}
while((div1.scrollHeight/2) <= parseInt(div1.style.height))
{
div1.innerHTML += div1.innerHTML;
}
}
function div1start()
{
div1interval=setInterval("div1scent();div1.scrollTop+=5;",100);
}
function div1scent()
{
if(div1.scrollTop == (div1.scrollHeight-parseInt(div1.style.height)))
{
div1.scrollTop = (div1.scrollHeight/2)-parseInt(div1.style.height);
}
}
-->
</SCRIPT>
</HEAD>
<BODY>
<div ID="div1" STYLE="overflow-y:hidden; width:100px; Height:101px;
display:block;"
onclick="alert('height: '+this.scrollHeight+', Top: '+this.scrollTop)">
<SCRIPT LANGUAGE="Javascript">
<!--
div1init();
div1start();
-->
</SCRIPT>
</div>
</BODY>
</HTML>

Lasse Reichstein Nielsen

unread,
Dec 7, 2003, 7:42:52 AM12/7/03
to
woo...@aol.com (Sangwoo Im) writes:

> Please take a look at my code. I made a script to scroll the contents of DIV
> tag. It works in IE, but not NN. I tried to use document.getElementById(id)
> function. It didn't work at all.

That would depend on how you used it, obviosuly.

> I just want it to run in NN7.1 which is latest.

Aim higher :) There are other browsers than IE and Mozilla/Netscape.


First, Does your HTML validate? (Answer: No. Make it before you go any
further).

HTML requires a DOCTYPE delaration.

> <HTML>
> <HEAD>
> <TITLE>TEST</TITLE>
> <SCRIPT LANGUAGE="Javascript">

In HTML 4, the type attribute is required. The language attribute is
not necessary when you have type.
<script type="text/javascript">

> <!--

No need for HTML-like comments.

> var div1interval;
> function div1init()
> {
> for(j=0; j<2;j++)
> {
> div1.innerHTML += 1+"<BR>";

innerHTML is proprietary. I assume this function is only for testing
though (filling the div with some arbitrary context).

I don't think "scrollHeight" works the same in Mozilla/Netscape as in IE.
It doesn't give the height of the entire content, just the height of the
visible area. You need a different way to calculate the height of the hidden
content.

You are using "div1" as a global variable, but you haven't initialized
it. In IE that would make it point to the element with id="div1". In
other browsers it won't.

This question comes up a lot. Is it time for an entry in the FAQ?

<FAQENTRY>Why doesn't the global variable "divId" refer to the element
with id="divId"?

It does in Internet Explorer, but not in *many* other browsers. The
recommended way of referring to an element with id="foo" is
document.getElementById("foo")
In order to support older browsers that doesn't implement this W3C DOM
method, fallback to proprietary features can be used. In Internet Explorer
4 (and WebTV?), you can use document.all["foo"] . In Netscape 4, maybe
you can use document.layers["foo"] , but only if the element is absolutely
positioned (or created with the Netscape 4 proprietary <layer> tag).

<URL:http://www.mozilla.org/docs/web-developer/upgrade_2.html#dom_access>
</FAQENTRY>
(better ideas obviously welcome)

> function div1start()
> {
> div1interval=setInterval("div1scent();div1.scrollTop+=5;",100);

Same problem here. Change "div1" into "document.getElementById('div1')"

> }
> function div1scent()
> {

Add
var div1 = document.getElementById("div1");
so you won't have to change "div1" everywhere.

> if(div1.scrollTop == (div1.scrollHeight-parseInt(div1.style.height)))

You compare with ==. You would probably want to use ">=", since you scroll
in steps of 5, so you can miss the exact value.

You use "div1.style.height" to get the current height. Just be aware that it
only works when div1 has its height set in the style attribute (as it does).
Another, non-standard, method is to use div1.offsetHeight.

...


> <div ID="div1" STYLE="overflow-y:hidden; width:100px; Height:101px;

"overflow-y" is a proprietary IE property, not CSS. Try "overflow:hidden".

> display:block;"

display:block is default for a div.


I still can't get it working in Opera.
/L
--
Lasse Reichstein Nielsen - l...@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Sangwoo Im

unread,
Dec 7, 2003, 11:22:59 AM12/7/03
to
Thank you for your replying post.

I will keep reading thru what you wrote multiple times then try to fix it.

However, I wonder whether a documentation which explains the difference of
Javascript among various browsers exists or not.

Anybody has an idea?

Richard Cornford

unread,
Dec 8, 2003, 10:04:32 AM12/8/03
to
"Lasse Reichstein Nielsen" <l...@hotpop.com> wrote in message
news:he0col...@hotpop.com...
<snip>

>This question comes up a lot. Is it time for an entry in the FAQ?

This is another of those cases where the question itself is not really
asked often but the information is very frequently included as part of
answers. That would suggest that maybe it should be in the FAQ (as other
entries (eval (#FAQ4_40), for example) got in by the same criteria).

><FAQENTRY>Why doesn't the global variable "divId" refer to
>the element with id="divId"?

I wonder whether that question shouldn't be worded "Why doesn't the
global variable "divId" always refer to the element with id="divId"?" -
or - "Why doesn't the global variable "divId" refer to the element with
id="divId" in all browsers?" (though the latter would mean re-wording
the opening sentence).

> It does in Internet Explorer, but not in *many* other

We could quibble about "*many*" as reproducing this IE feature seems to
be quite common among modern browsers, Mozilla/Gecko browsers being
primarily the ones that render this IE shortcut invalid in cross-browser
scripting.

> browsers. The recommended way of referring to an element
> with id="foo" is
> document.getElementById("foo")
> In order to support older browsers that doesn't implement
> this W3C DOM method, fallback to proprietary features can be
> used. In Internet Explorer 4 (and WebTV?), you can use
> document.all["foo"] . In Netscape 4, maybe you can use
> document.layers["foo"] , but only if the element is absolutely
> positioned (or created with the Netscape 4 proprietary
> <layer> tag).
>
><URL:http://www.mozilla.org/docs/web-developer/upgrade_2.html#dom_acces
s>
> </FAQENTRY>
> (better ideas obviously welcome)

In Netscape 4 elements with - position:relative - also appear in the -
layers - collection so maybe the last sentence should go "..., but only
if the element is CSS positioned (or created with ...".

Thinking about the role of FAQ entries, it seems to me that the purpose
of posting a URL reference to a part of the FAQ is to avoid repeating
the same explanation in response to questions. To that end I would
probably be a bit more long-winded and want to include an example
fallback function:-

<longer_proposal>
A common shortcut in accessing DOM elements that have ID attributes
(introduced by IE and reproduced in some other browsers) is to use the
ID string as an identifier for the element. However, not all browsers
support this shortcut and more general methods exist for accessing IDed
elements. The widest support is offered by the document.getElementById
method, which is part of the W3C DOM standard and implemented in most
modern browsers (including IE from version 5.0). So an element with
id="foo" can be referenced with:-

var el = document.getElementById("foo");

In order to support older browsers that doesn't implement this W3C DOM
method, fallback to proprietary features can be used. In Internet
Explorer 4 (and WebTV?), you can use document.all["foo"] . In Netscape
4, maybe you can use document.layers["foo"] , but only if the element is

CSS positioned (or created with the Netscape 4 proprietary <layer> tag).
E.G.:-

function getElementWithId(id){
if(document.getElementById){ //prefer the W3C DOM method.
return document.getElementById(id);
}else if(document.all){ //fallback for IE 4(and some others)
return document.all[id];
}else if(document.layers){ //fallback for Net 4 (sometimes)
return document.layers[id]; //Will not work for layers nested
//within layers. A recursive
//search of nested layers would
//be needed to find such a layer
}
} // remember to test the value returned from this function as some
// browsers do not support any of the methods used here.
</longer_proposal>

- but FAQ entries also need to be short so maybe not.

Richard.


Jim Ley

unread,
Dec 8, 2003, 2:49:14 PM12/8/03
to
On Mon, 8 Dec 2003 15:04:32 -0000, "Richard Cornford"
<Ric...@litotes.demon.co.uk> wrote:

>"Lasse Reichstein Nielsen" <l...@hotpop.com> wrote in message

>><FAQENTRY>Why doesn't the global variable "divId" refer to


>>the element with id="divId"?

I'm reading very infrequently at the minute, whilst I do pick up the
FAQENTRY's when later reviewing, the main motivation for a session at
editing the FAQ is lots of FAQENTRY's being seen, if you could CC me
these it may get them done quicker...

>- but FAQ entries also need to be short so maybe not.

I like the idea, and think it would be a valuable addition, but
shorter for sure!

Jim.
--
comp.lang.javascript FAQ - http://jibbering.com/faq/

0 new messages