Announcement

**Willy Duitt** · Feb 16, 2004, 02:34 PM

Here's one way;

document.onmouseover=function(){
if (!IE){e = arguments[0].target}
if(IE){e = window.event.srcElement}
for(var i=1; i<=9; i++){
if(e.id==('img'+i)){(Smiley+i).stopFD()}}}

**JAVAEOC** · Feb 16, 2004, 04:00 PM

but then it sais Smiley is not defiened

**Willy Duitt** · Feb 16, 2004, 04:58 PM

Then it might be Smiley[i]
I don't know. You have not provided enough code for me to see where Smiley1 ect. come from. Work with it. Try putting Smiley in an array and split them out...

.....Willy

**JAVAEOC** · Feb 16, 2004, 05:04 PM

the whole code:

Code:

<html>
<head>
<style>
.img{
	filter: alpha(opacity=30);
	-moz-opacity: 0.3;
	}
</style>
<script>

function fade(imgID){	
	var me=this;
	this.i=.3
	this.stopFU=function(){me.UD=0;me.fadeDown()}
	this.stopFD=function(){me.UD=1;me.fadeUp()}
	this.imgId=imgID;

	this.fadeUp=function(){
		if(me.i<.94 && me.UD==1){
			me.i+=0.06
			document.getElementById(me.imgId).style.MozOpacity=me.i;
			document.getElementById(me.imgId).style.filter='alpha(opacity='+me.i*100+')';
			setTimeout(me.fadeUp, 10)
			}
		else{me.stopFU}
		}
		
	this.fadeDown=function(){
		if(me.i>=.3 && me.UD==0){
			me.i-=0.01;
			document.getElementById(me.imgId).style.MozOpacity=me.i;
			document.getElementById(me.imgId).style.filter='alpha(opacity='+me.i*100+')';
			setTimeout(me.fadeDown, 10);			
			}
		else{me.UD=1}
		}
	}

var Smiley1=new fade('img1');
var Smiley2=new fade('img2');
var Smiley3=new fade('img3');
var Smiley4=new fade('img4');
var Smiley5=new fade('img5');
var Smiley6=new fade('img6');
var Smiley7=new fade('img7');
var Smiley8=new fade('img8');
var Smiley9=new fade('img9');

var IE = document.all?true:false

document.onmouseover=function(){
						if (!IE){e = arguments[0].target}
						if(IE){e = window.event.srcElement}
						if(e.id=='img1'){Smiley1.stopFD()}
						if(e.id=='img2'){Smiley2.stopFD()}
						if(e.id=='img3'){Smiley3.stopFD()}
						if(e.id=='img4'){Smiley4.stopFD()}
						if(e.id=='img5'){Smiley5.stopFD()}
						if(e.id=='img6'){Smiley6.stopFD()}
						if(e.id=='img7'){Smiley7.stopFD()}
						if(e.id=='img8'){Smiley8.stopFD()}
						if(e.id=='img9'){Smiley9.stopFD()}
						}
						
document.onmouseout=function(){
						if (!IE){e = arguments[0].target}
						if(IE){e = window.event.srcElement}
						if(e.id=='img1'){Smiley1.stopFU()}
						if(e.id=='img2'){Smiley2.stopFU()}
						if(e.id=='img3'){Smiley3.stopFU()}
						if(e.id=='img4'){Smiley4.stopFU()}
						if(e.id=='img5'){Smiley5.stopFU()}
						if(e.id=='img6'){Smiley6.stopFU()}
						if(e.id=='img7'){Smiley7.stopFU()}
						if(e.id=='img8'){Smiley8.stopFU()}
						if(e.id=='img9'){Smiley9.stopFU()}
						}
</script>
</head>
<body>
<img src="smiley.gif" id="img1" class="img"><br>
<img src="smiley.gif" id="img2" class="img"><br>
<img src="smiley.gif" id="img3" class="img"><br>
<img src="smiley.gif" id="img4" class="img"><br>
<img src="smiley.gif" id="img5" class="img"><br>
<img src="smiley.gif" id="img6" class="img"><br>
<img src="smiley.gif" id="img7" class="img"><br>
<img src="smiley.gif" id="img8" class="img"><br>
<img src="smiley.gif" id="img9" class="img"><br>
</body>
</html>

well the thing is that smiley1 and so is an object and it doesnt read Smiley+i as Smiley1

**beetle** · Feb 16, 2004, 05:21 PM

Code:

for(var i=1; i<=9; i++)
{
    if( e.id == ( 'img' + i ) )
    {
        window['Smiley' + i].stopFD();
    }
}

**JAVAEOC** · Feb 16, 2004, 05:37 PM

thanks alot... but why does it work can i do the same thing with variables like these:

var Smiley1=new fade('img1');
var Smiley2=new fade('img2');
var Smiley3=new fade('img3');
var Smiley4=new fade('img4');
var Smiley5=new fade('img5');
var Smiley6=new fade('img6');
var Smiley7=new fade('img7');
var Smiley8=new fade('img8');
var Smiley9=new fade('img9');

thanks again works great

**Willy Duitt** · Feb 16, 2004, 05:37 PM

Or something like this:

Code:

<script type="text/javascript">
  var img = new Array()
      img[0] = 'img1';
      img[1] = 'img2';
      img[2] = 'img3';
      img[3] = 'img4';
      img[4] = 'img5';
      img[5] = 'img6';
      img[6] = 'img7';
      img[7] = 'img8';
      img[8] = 'img9';

 for(i=0; i<img.length; i++){
  var Smiley = new Array()
      Smiley[i] = new fade(img[i]);

      document.onmouseover=function(){
        if(!IE){e = arguments[0].target};
        if(IE){e = window.event.srcElement};
        if(e.id==img[i]){Smiley[i].stopFD()}}
 }
</script>

But you should go back to the basics.
If you would have remembered that javascript starts counting at 0 and named your images accodingly, it would have been easier defining the img[array] by defing it like I did the Smiley[array] instead of explicitly assigning a value.

.....Willy

BTW: I know I could have used: new fade(img[i+1])
But that is goofy....

**JAVAEOC** · Feb 16, 2004, 05:49 PM

that would be the same amout of text.... but nicer yes. However what if i have over 100 fading objects? Too much writing for me

so why would this work:

for(a=1; a<=9; a++){
var Smiley+a=new fade('img'+a)
}

??

then i also tried that window thing

for(a=1; a<=9; a++){
window['var Smiley'+a]=new fade('img'+a)
}

**Willy Duitt** · Feb 16, 2004, 05:56 PM

What do you mean too much writing. If your images were numbered from 0 it would be a snap to build both the img and Smiley arrays.

Code:

<script type="text/javascript">
 for(i=0; i<9; i++){
  var img = new Array();
  var Smiley = new Array();
      Smiley[i] = new fade(img[i]);

      document.onmouseover=function(){
        if(!IE){e = arguments[0].target};
        if(IE){e = window.event.srcElement};
        if(e.id==img[i]){Smiley[i].stopFD()}}
 }
</script>

Like I said, you could use: new fade(img[i+1]);
But that is goofy and reflects poor planning and implementation.

.....Willy

**JAVAEOC** · Feb 16, 2004, 06:02 PM

but the code u gave me doesnt work....

for(i=0; i<9; i++){
var Smiley = new Array()
Smiley[i] = new fade('img'+i)
}

var IE = document.all?true:false

document.onmouseover=function(){
if (!IE){e = arguments[0].target}
if(IE){e = window.event.srcElement}
for(var i=1; i<=9; i++){
if(e.id==('img'+i)){Smiley[i].stopFD();}
}
}

thats how i am using it but why wont it work?

**Willy Duitt** · Feb 16, 2004, 06:40 PM

I can't run your codes without images.
Use alerts to see what is being passed....

.....Willy

**JAVAEOC** · Feb 16, 2004, 06:51 PM

a zip file

thanks

Attached Files

smiley.zip (2.2 KB, 105 views)

**glenngv** · Feb 16, 2004, 11:55 PM

Originally posted by JAVAEOC

then i also tried that window thing

for(a=1; a<=9; a++){
window['var Smiley'+a]=new fade('img'+a)
}

That window thing would work if you remove the var keyword.

beetle didn't put the var, did he?

Code:

for(var i=1; i<=9; i++)
{
    if( e.id == ( 'img' + i ) )
    {
        window['Smiley' + i].stopFD();
    }
}

**RadarBob** · Feb 17, 2004, 08:28 AM

Code:

if(e.id==('img'+i)){(Smiley+i).stopFD()}}}

Smiley needs to be in quotes.

Announcement

Looping?

Looping?

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment