MyBB Community Forums

Full Version: function opacity
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
Hi,
This is a code for setting colors by given keywords like: "#FFFEF2" color for "light" keyword:

<script type="text/javascript">
function coloring(div,color){
    var mything=document.getElementById(div);
        if(color=="light"){
            mything.style.color="#FFFEF2";
        }else if(color=="dark"){
            mything.style.color="#4F2F2F";
        }
}
</script>

I want to have a similar one for opacity, Can anyone help me?
Use jQuery.

jQuery("mything").css("opacity", "0.5");
edit: delayed response

you can try this (such functions available on many web sites)
(07-04-2013, 07:41 AM)effone Wrote: [ -> ]Use jQuery.

jQuery("mything").css("opacity", "0.5");

Mything is a variable, It shouldn't be wrapped with quotes. "jQuery("mything")" will target an element with tagname mything.

also, more browser-compatible version would be
$(mything).css({
'opacity': '.5',
'-webkit-opacity': '.5',
'-o-opacity': '.5',
'-moz-opacity': '.5',
'-ms-opacity': '.5',
'-ms-filter':"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"
});
Thanks, So I think it should be like this:

<script type="text/javascript">
function setOpacity (myElement, opacityValue) {
	if (window.ActiveXObject) {
		myElement.style.filter = "alpha(opacity="30")";
        }if (window.ActiveXObject){
		myElement.style.filter = "alpha(opacity="60")";
        }
}
</script>

But 1 more question:
As I said before in my code we have keywords for setting colors, For example:
        if(color=="light")

How can I have such keywords in this code? How can i include keywords in "if statement"? Can you give an example?
(07-04-2013, 08:58 AM)jvdabz Wrote: [ -> ]How can I have such keywords in this code? How can i include keywords in "if statement"? Can you give an example?

If i understand your question correctly, all you need to do is pass a third argument and then simply use "if(color=='whatever')"
function setOpacity (myElement, opacityValue, color) {
//function here
}

And your function doesn't seem to use the passed opacity value.
Let me explain what I mean easier:
How can I change the function from setting color to setting opacity?Should it be like this?:

<script type="text/javascript">
function setOpacity (myElement, opacityValue) {
        if(opacity=="light"){
        myElement.style.filter = "alpha(opacity="30")";
        }else if(opacity=="dark"){
        myElement.style.filter = "alpha(opacity="50")";
        }
}
</script>

Please give me the correct code.
Nobody could help me?
(07-05-2013, 08:36 AM)jvdabz Wrote: [ -> ]Let me explain what I mean easier:
How can I change the function from setting color to setting opacity?Should it be like this?:

<script type="text/javascript">
function setOpacity (myElement, opacityValue) {
        if(opacity=="light"){
        myElement.style.filter = "alpha(opacity="30")";
        }else if(opacity=="dark"){
        myElement.style.filter = "alpha(opacity="50")";
        }
}
</script>

Please give me the correct code.

that is IE friendly code. use

element.style.opacity = "0.9";

for other browsers
I believe you want something like this?

function setOpacity(myElement, opacityValue) {
        var element = document.getElementById(myElement);
        if(opacityValue == "light"){
                element.style.opacity = ".3";
        }else if(opacityValue == "dark"){
                element.style.opacity = ".5";
        }
}

Then you would activate it like:

setOpacity("logo", "light");

Is that what you were looking for?


Oh, btw you can change the keywords in the if statements. Like:

function setOpacity(myElement, opacityValue) {
        var element = document.getElementById(myElement);
        if(opacityValue == "cantSeeMe"){
                element.style.opacity = ".3";
        }else if(opacityValue == "mediumOpacity"){
                element.style.opacity = ".5";
        }
}

and use it like:

setOpacity("logo", "cantSeeMe");
Pages: 1 2