...

View Full Version : document.images won't work in a function?



CFre
07-11-2011, 01:08 PM
Hello codingforums! I'm new to javascript and have a problem regarding functions.

I've been trying to create a slideshow, and while testing different syntax etc. I'm getting stuck at why this works:



document.images.portrait.src = img2.src;


And not this:


function slideshow(){
document.images.portrait.src = img2.src;
}


Thanks for any help!

bullant
07-11-2011, 01:11 PM
unless img2.src has been defined as a global variable then you have a scope (http://www.mredkj.com/tutorials/reference_js_intro.html#scope) issue because the function can't see any variables defined outside of it unless they are global variables.

CFre
07-11-2011, 01:17 PM
The image is defined in the <head> as following:



<script type="text/javascript">
<!--
var img1 = new Image();
img1.src = "Photoshop/Portrait_Rebecca.png";
var img2 = new Image();
img2.src = "Photoshop/Portrait_Hans.png";
//-->
</script>


Isn't the variables automaticly "global"(accesible wherever?) if defined this way?

CFre
07-11-2011, 01:32 PM
I've seen several code examples using this within functions, and I'm having a hard time seeing what I'm doing wrong. Can gladly post the whole code if necessary, but as said above the image variables are declared in the <head> and I'm having no problems with switching images with code like this: document.images.portrait.src = img2.src;
As long as its not within a function. :confused:

bullant
07-11-2011, 01:32 PM
yep, it is...but you're posting only bits and pieces of your code so obviously there is a problem elsewhere in your code that you haven't posted.

My crystal ball isn't back from its 2500 year service yet so I can't use it to see the rest of your code.

CFre
07-11-2011, 01:35 PM
This works:


<head>

<script type="text/javascript">
<!--
var img1 = new Image();
img1.src = "Photoshop/Portrait_Rebecca.png";
var img2 = new Image();
img2.src = "Photoshop/Portrait_Hans.png";
//-->
</script>

</head>
<body>

<img src="Photoshop/Portrait_Rebecca.png" name="portrait" width="340" height="260"/>
<script type="text/javascript">
document.images.portrait.src = img2.src;
function slideshow(){
/*document.images.portrait.src = img2.src;*/
}

</script>


This doesn't:


<script type="text/javascript">
<!--
var img1 = new Image();
img1.src = "Photoshop/Portrait_Rebecca.png";
var img2 = new Image();
img2.src = "Photoshop/Portrait_Hans.png";
//-->
</script>

</head>
<body>
<img src="Photoshop/Portrait_Rebecca.png" name="portrait" width="340" height="260"/>
<script type="text/javascript">
/*document.images.portrait.src = img2.src;*/
function slideshow(){
document.images.portrait.src = img2.src;
}

</script>

bullant
07-11-2011, 01:40 PM
so where are you actually calling the function slideshow()?

When you declare a function all it is doing is sitting there gathering dust until you actually call it.

CFre
07-11-2011, 01:43 PM
Edit: Found the solution! body onload seems to work, thanks for the help :)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum