Originally Posted by
adrumsolo4u 
what i am trying to accomplish is to have two elements lets say SEND and RECEIVE.
when i click the element SEND i want the RECEIVE element to receive the effect.
currently my script only effects the element itself:
var animElements = document.getElementById("send").getElementsByTagName("p");
for(var i=
0; i<animElements.
length; i++
) { animElements[i].onclick = sizeChange;
}
what i want to happen:
var animElements = document.getElementById("send").getElementsByTagName("p");
for(var i=
0; i<animElements.
length; i++
) { when element is clicked, other element (recieve) goes to sizeChange
}
here is the sizechange function:
function sizeChange() {
if (!this.currentWidth) this.currentWidth = 150;
doWidthChangeMem(this,this.currentWidth,170,10,10,0.333);
this.onclick = sizeRestore;
}
function sizeRestore() {
doWidthChangeMem(this,this.currentWidth,150,10,10,0.5);
this.onclick = sizeChange;
}
is there a way to do this (without using an html link)?
The sizeChange and sizeRestore functions reference the HTML Element calling them via the this keyword. When the onclick event is is triggered,
this will refer to the Element on which it is triggered.
The simplest (to understand) thing to do is to change all the
this keyword to a variable such as
el. And pass the Element you want changed to the function as
el.
eg:
function sizeChange(el) {
if (!el.currentWidth) el.currentWidth = 150;
doWidthChangeMem(el,el.currentWidth,170,10,10,0.333);
el.onclick = sizeRestore;
}
Now you will have to use:
el1.onclick = function() { sizeChange(el2); };
where el1 is the element to be clicked, and el2 is the element to change.
Another way of doing it is to have the function called in the scope of the element to be changed, so that
this would refer to the correct element.
eg:
el1.onclick = function() { sizeChange.call(el2); };
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
