roating image script not working?

M

melanie watts

ok I got this from Tom Negrino's book , "Javascript for the world wide
web 2 edition"

I downloaded it, (script 3.7) off their website
http://www.chalcedony.com/javascript2e/pages/scriptsf.html

The script is used to display a random image whenever someone enters
your website.

I adjusted the script to fit my needs. my webpage uses css and is
written in xhtml, this may be the problem, Anyhow it doesnt work. what
have I done wrong?
Thanks Melanie


<SCRIPT LANGUAGE=JAVASCRIPT>
<!-- Hide script from old browsers
// This script copyright 1997, Tom Negrino and Dori Smith.
// This script is from "JavaScript for the WWW, Visual QuickStart
Guide, 2nd Ed."
// For more information, see <http://www.chalcedony.com/javascript/>.
// This script may be used and modified, but the copyright notice
must remain intact.

var r1 = new Array(26)"http://www3.telus.net/mjw/r1/1.jpg",
"http://www3.telus.net/mjw/r1/10.jpg",
"http://www3.telus.net/mjw/r1/11.jpg",
"http://www3.telus.net/mjw/r1/2.jpg",
"http://www3.telus.net/mjw/r1/22.jpg",
"http://www3.telus.net/mjw/r1/3.jpg",
"http://www3.telus.net/mjw/r1/33.jpg",
"http://www3.telus.net/mjw/r1/4.jpg",
"http://www3.telus.net/mjw/r1/44.jpg",
"http://www3.telus.net/mjw/r1/5.jpg",
"http://www3.telus.net/mjw/r1/55.jpg",
"http://www3.telus.net/mjw/r1/6.jpg",
"http://www3.telus.net/mjw/r1/7.jpg"
"http://www3.telus.net/mjw/r1/8.jpg",
"http://www3.telus.net/mjw/r1/9.jpg",
"http://www3.telus.net/mjw/r1/dec3.jpg",
"http://www3.telus.net/mjw/r1/dp.jpg",
"http://www3.telus.net/mjw/r1/frozenwaterfall.jpg",
"http://www3.telus.net/mjw/r1/house.jpg",
"http://www3.telus.net/mjw/r1/house01.jpg",
"http://www3.telus.net/mjw/r1/imageo114.jpg",
"http://www3.telus.net/mjw/r1/pine.jpg",
"http://www3.telus.net/mjw/r1/pineriver.jpg",
"http://www3.telus.net/mjw/r1/pineriverbridge.jpg",
"http://www3.telus.net/mjw/r1/tree.jpg",
"http://www3.telus.net/mjw/r1/wf.jpg"

function choosePic() {
if (document.images) {
randomNum = Math.floor((Math.random()*10)) % 3
document.mypicture.src = r1[randomNum]
}
}

// End hiding script from old browsers -->
</SCRIPT>

<BODY BGCOLOR="WHITE" onload="choosePic()">
<IMG SRC="http://www3.telus.net/mjw/r1/dec3.jpg" WIDTH="200"
HEIGHT="135" NAME="myPicture" align="right";">
 
I

Ivo

<SCRIPT LANGUAGE=JAVASCRIPT>
Click to expand...

Change that to

<script type="text/javascript">

You say your page is xhtml. So tags are all lowercase and attributes are all
quoted. Furthermore, there is no language attribute (anymore) and the type
is required.
<!-- Hide script from old browsers
Click to expand...

All known browsers know to hide script contents, even if they can't execute
it. So no need for those SGML comment delimiters, it is best to remove them.
var r1 = new Array(26)"http://www3.telus.net/mjw/r1/1.jpg",
"http://www3.telus.net/mjw/r1/10.jpg",
Click to expand...

That 's a syntax error, listing the image url's outside the array
definition. Change to

var r1 = new Array(
"http://www3.telus.net/mjw/r1/1.jpg" ,
"http://www3.telus.net/mjw/r1/10.jpg" ,
"http://www3.telus.net/mjw/r1/11.jpg" );

etc. and be careful to put comma's after each one except the last.
function choosePic() {
if (document.images) {
randomNum = Math.floor((Math.random()*10)) % 3
Click to expand...

That 3 comes from their original script, which has just three pictures. You
may want to make it more flexible by using the array's length instead.
Something like:

var randomNum = Math.floor( Math.random() * r1.length );
document.mypicture.src = r1[randomNum]
Click to expand...

Should probably be:

document.images.mypicture.src = r1[randomNum];
}
}
Click to expand...

hth
 
M

melanie watts

Hi Ivo, Thanks so much for your help, however, after making all your
suggested changes it still does not work.

Melanie
 
L

Lee

melanie watts said:
Hi Ivo, Thanks so much for your help, however, after making all your
suggested changes it still does not work.
Click to expand...


The code changes the src attribute of "mypicture",
but the actual name of your image is "myPicture".
Correct it so that they are the same.

If it still doesn't work, post your modified code.
 
F

Fred Oz

melanie said:
ok I got this from Tom Negrino's book , "Javascript for the world wide
web 2 edition"
Click to expand...

In addition to comments above:

[...]
var r1 = new Array(26)"http://www3.telus.net/mjw/r1/1.jpg",
"http://www3.telus.net/mjw/r1/10.jpg",
Click to expand...

There is no need to state the length of the array - it will expand to
accommodate whatever is put in it. You don't even need to use
"new Array":

var r1 = ["http://www3.telus.net/mjw/r1/1.jpg",
"http://www3.telus.net/mjw/r1/10.jpg",
...
];

<IMG SRC="http://www3.telus.net/mjw/r1/dec3.jpg" WIDTH="200"
HEIGHT="135" NAME="myPicture" align="right";">
Click to expand...

The NAME attribute for images is only for backward compatability. ID
should be used.

There is a random ';" ' at the end of the tag that will break the HTML.

There is a missing ',' after "....7.jpg"

The "bgcolor" attribute is depreciated, use:

style="background-color: white;"

When you replace the src, all images will contine to be displayed at
200 x 135.

Loading the new image using onload means that the default image loads,
then the random. It would be better to modify the image src before the
first image loads, so only the random is shown, but keep the current
fail-over that if JS is not enabled, the default will still load.

Use the W3C HTML validator to check the HTML first (look in the left
margin menu).

<URL:http://www.w3.org/>

Below is working code, tested in Safari.


<html<head><title>images</title>
<script type="text/javascript">
var r1 = [
"http://www3.telus.net/mjw/r1/1.jpg",
"http://www3.telus.net/mjw/r1/10.jpg",
"http://www3.telus.net/mjw/r1/11.jpg",
"http://www3.telus.net/mjw/r1/2.jpg",
"http://www3.telus.net/mjw/r1/22.jpg",
"http://www3.telus.net/mjw/r1/3.jpg",
"http://www3.telus.net/mjw/r1/33.jpg",
"http://www3.telus.net/mjw/r1/4.jpg",
"http://www3.telus.net/mjw/r1/44.jpg",
"http://www3.telus.net/mjw/r1/5.jpg",
"http://www3.telus.net/mjw/r1/55.jpg",
"http://www3.telus.net/mjw/r1/6.jpg",
"http://www3.telus.net/mjw/r1/7.jpg",
"http://www3.telus.net/mjw/r1/8.jpg",
"http://www3.telus.net/mjw/r1/9.jpg",
"http://www3.telus.net/mjw/r1/dec3.jpg",
"http://www3.telus.net/mjw/r1/dp.jpg",
"http://www3.telus.net/mjw/r1/frozenwaterfall.jpg",
"http://www3.telus.net/mjw/r1/house.jpg",
"http://www3.telus.net/mjw/r1/house01.jpg",
"http://www3.telus.net/mjw/r1/imageo114.jpg",
"http://www3.telus.net/mjw/r1/pine.jpg",
"http://www3.telus.net/mjw/r1/pineriver.jpg",
"http://www3.telus.net/mjw/r1/pineriverbridge.jpg",
"http://www3.telus.net/mjw/r1/tree.jpg",
"http://www3.telus.net/mjw/r1/wf.jpg"
];

function choosePic() {
var randomNum = Math.floor( Math.random() * r1.length );
if (document.images) {
document.images('myPicture').src = r1[randomNum];
}
}
</SCRIPT>
<BODY style="background-color: white;" onload="choosePic()">
<IMG SRC="http://www3.telus.net/mjw/r1/dec3.jpg" WIDTH="200"
HEIGHT="135" id="myPicture" align="right">


</body></html>
 
R

RobB

mellly said:
Wow. Thanks. It works. Interesting that it does work in Safari and
Explorer but not Mozilla or Firefox? Wonder Why That is?

Melanie
Click to expand...

Fred Oz wrote:

(snip)
document.images('myPicture').src = r1[randomNum];
Click to expand...

Should be:

document.images['myPicture'].src = r1[randomNum];

....as only Internet Explorer - and now apparently Safari - support
parentheses for array dereferencing.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Displaying a random image 1
javascript cycling graphic does not work on MAC IE 3
Website template. 3
bad loading image -> SAFARI 1
Force index.html 2
random image and browser test 0
Help with my responsive home page 2
How do I place a dynamic value in the HREF 10

Members online

Total: 30 (members: 2, guests: 28)
Robots: 186

Forum statistics

Threads
473,774
Messages
2,569,598
Members
45,152
Latest member
LorettaGur

Latest Threads

Top