Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Check object opacity - cross browswer

Status
Not open for further replies.

bdichiara

Programmer
Oct 11, 2006
206
US
is there an efficient cross browser way to check opacity?

I have a few functions that run, however i'd like for them only run if the object's current opacity is set to 0.

here's the code:
Code:
function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}

function showPopup(){
	opacity('search_popup', 0, 100, 500);
	setTimeout("opacity('search_popup', 100, 0, 500)",5000);
}

I've attempted an if statement like this:
Code:
function showPopup(){
	if(document.getElementById('search_popup').style.opacity == 0 || document.getElementById('search_popup').style.MozOpacity == 0 || document.getElementById('search_popup').style.KhtmlOpacity == 0 || document.getElementById('search_popup').style.filter == "alpha(opacity=0)"){
		opacity('search_popup', 0, 100, 500);
		setTimeout("opacity('search_popup', 100, 0, 500)",5000);
	}
}
that if statement only seems to work in Firefox.

I've also tried giving my element the style of "display:none" and running an if statement on that, and if it is hidden, then set it to "style.display = ''", but causes the fade to not work all together.

Any ideas.

_______________
_brian.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top