A JS script which works fine in IE / FF, but not in Opera... (?)

Fox · Aug 18, 2007

Hi there!

I'm new on the group

I recently started to learn JavaScript, and I have a really weird
problem...

The script below (a simple slideshow) is working okay in both IE and
FireFox, but in Opera it displays only the first image.... I would
like to make it working on any browsers, I already tried many
variations, but it is still not working in Opera (I am using Opera
9.23 build 660 on Linux).

<HTML>
<HEAD>
</HEAD>
<BODY>

<DIV NAME=Photo>
<IMG SRC=snap1.png BORDER=1 WIDTH=512 HEIGHT=448>
</DIV>

<script>
i=2
function NextImg(){
if(i>2)i=1
document.all["Photo"].innerHTML="<IMG SRC=snap"+i+".png
BORDER=1 WIDTH=512 HEIGHT=448>"
i++
}
setInterval("NextImg()",4000)
</script>

</BODY>
</HTML>

Have anybody already seen such trouble with Opera?

Best regards,
Mateusz Viste

Gregor Kofler · Aug 18, 2007

Fox meinte:

The script below (a simple slideshow) is working okay in both IE and
FireFox, but in Opera it displays only the first image....

How about having a look at the JS error console? [1]

I would
like to make it working on any browsers, I already tried many
variations, but it is still not working in Opera (I am using Opera
9.23 build 660 on Linux).

Interesting, that it works on *any* browser...

<HTML>
<HEAD>
</HEAD>
<BODY>

<DIV NAME=Photo>
<IMG SRC=snap1.png BORDER=1 WIDTH=512 HEIGHT=448>
</DIV>

Enclosing attribute values in quotes is never a bad idea...
Divs don't have names, maybe IDs.

<script>

Type missing.

i=2
function NextImg(){
if(i>2)i=1
document.all["Photo"].innerHTML="<IMG SRC=snap"+i+".png

document.all is proprietary, can be easily replaced by getElementById(),
sometimes getElementsByName(), etc.

Why innerHTML? Exchanging the src value would do.

BORDER=1 WIDTH=512 HEIGHT=448>"
i++
}
setInterval("NextImg()",4000)

setInterval() is a method of the window object.

</script>

</BODY>
</HTML>

Have anybody already seen such trouble with Opera?

Plenty of opportunities for any browser to get into problems.

And when you're at it: Make your code more readable; some extra
whitespace sprinkled here and there, semicolons for terminating
commands, ...

Gregor

[1] http://operawiki.info/OperaJSConsole

Fox · Aug 18, 2007

How about having a look at the JS error console? [1]

Good Idea

document.all is proprietary, can be easily replaced by getElementById(),
sometimes getElementsByName(), etc.

Why innerHTML? Exchanging the src value would do.

Interesting!
Indeed, it seems that the line above is making trouble to Opera. How
to replace document.all to GetElementById? What's wrong in innerHTML?

Thank you!

Gregor Kofler · Aug 18, 2007

Fox meinte:

Indeed, it seems that the line above is making trouble to Opera. How
to replace document.all to GetElementById?

See below and [1] and Google. (I suggest some FAQ browsing, for this
very basic stuff.)

What's wrong in innerHTML?

It's not part of the W3C DOM, though understood by most contemporary
browsers with various issues ([2] or Google might be a good starting
point). In your example it's overkill.

Markup: <img id="foo" ...>

JS: document.getElementById("foo").src = "newpic.jpg";

[1]
http://developer.mozilla.org/en/docs/DOM:document.getElementById
[2]
http://developer.mozilla.org/en/docs/DOM:element.innerHTML

Gregor

Thomas 'PointedEars' Lahn · Aug 18, 2007

Gregor said:
Fox meinte:

What's wrong in innerHTML?

Click to expand...

It's not part of the W3C DOM, though understood by most contemporary
browsers with various issues ([2] or Google might be a good starting
point). In your example it's overkill.

Markup: <img id="foo" ...>

JS: document.getElementById("foo").src = "newpic.jpg";

It is more compatible (back to DOM Level 0) to give the `img' element
a name (here: name="foo") and then use

document.images["foo"].src = "newpic.jpg";

Although with current UAs the `images' collection also works with IDs,
as specified in W3C DOM Level 2 HTML.

PointedEars

Fox · Aug 20, 2007

Okay, the slideshow script is working now on IE / FF and Opera

Thank you, Gregor, PointedEars, for your valuable help!

Here is the final version of the slideshow script, for any JS beginner
(like me) who would need it ;-)

<script type='text/javascript'>
i=2
function NextImg(){
if (i>34) i=1;
document.images["screenshot"].src = "../snapshot/100in1/snap"+i
+".png";
i++;
}
setInterval("NextImg()",3000)
</script>

Script working in Firefox but not Chrome and Safari	3	Apr 6, 2021
I am trying to detect Which image id="" was clicked ?	22	Jan 3, 2023
On-air script	0	Aug 7, 2022
Problem: script works in IE but not FF	5	May 16, 2011
My sliding panel in React Js with graphs on it renders nothing but a blank screen--need help	0	Dec 9, 2019
JS FLV Video Player works fine in FF but error in IE	1	Apr 11, 2007
works in Opera and IE but not FF or Chrome - why?	6	May 7, 2011
Help with Visual Lightbox: Scripts	2	May 3, 2023

A JS script which works fine in IE / FF, but not in Opera... (?)

Fox

Gregor Kofler

Fox

Gregor Kofler

Thomas 'PointedEars' Lahn

Fox

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads