By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,481 Members | 1,213 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,481 IT Pros & Developers. It's quick & easy.

roating image script not working?

P: n/a
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/javascript.../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";">
Jul 23 '05 #1
Share this Question
Share on Google+
7 Replies


P: n/a
Ivo
"melanie watts" wrote
<SCRIPT LANGUAGE=JAVASCRIPT>
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
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",
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
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]
Should probably be:

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


hth
--
ivo
Jul 23 '05 #2

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

Melanie
Jul 23 '05 #3

P: n/a
Lee
melanie watts said:

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

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.

Jul 23 '05 #4

P: n/a
melanie watts wrote:
ok I got this from Tom Negrino's book , "Javascript for the world wide
web 2 edition"
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",
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";">


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>

--
Fred
Jul 23 '05 #5

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

Melanie

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Jul 23 '05 #6

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

Melanie

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Fred Oz wrote:

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


Should be:

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

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

Jul 23 '05 #7

P: n/a
Cool, now it working in Mozilla on my ibook. Thanks so much for your
help. I really appreaciate it.
Melanie

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!
Jul 23 '05 #8

This discussion thread is closed

Replies have been disabled for this discussion.