View Single Post
Old 12-04-2012, 03:25 PM   PM User | #1
Krentenbol
New Coder

 
Join Date: Sep 2011
Posts: 99
Thanks: 0
Thanked 0 Times in 0 Posts
Krentenbol is an unknown quantity at this point
JavaScript fading in/out script when fading in one, fade out others

I got this code:

Code:
var fade_in_from = 0;
var fade_out_from = 10;
function fadeIn(element){
	var target = document.getElementById(element);
	target.style.display = "block";
	var newSetting = fade_in_from / 10;
	target.style.opacity = newSetting;
	// opacity ranges from 0 to 1
	fade_in_from++;
	if(fade_in_from == 10){
		target.style.opacity = 1;
		clearTimeout(loopTimer);
		fade_in_from = 0;
		return false;
		
	}
	var loopTimer = setTimeout('fadeIn(\''+element+'\')',50);
}
function fadeOut(element){
	var target = document.getElementById(element);
	var newSetting = fade_out_from / 10;
	target.style.opacity = newSetting;
	fade_out_from--;
	if(fade_out_from == 0){
		target.style.opacity = 0;
		clearTimeout(loopTimer);
		fade_out_from = 10;
		return false;
	}
	var loopTimer = setTimeout('fadeOut(\''+element+'\')',50);
}
And for example when div1 fades in, I want div2 and div3 fade out.

I tried something and put this within the fadeIn function without any result.

if(target == 'div1') {
fadeOut('div2');
fadeOut('div3');
}

Could someone help me?

Many thanks.
Krentenbol is offline   Reply With Quote