...

View Full Version : color on top of image??



poker298
10-21-2009, 10:53 PM
I have an image that is gray-scale, and I want to dynamically change the color using CSS. Is this possible?

#example {
background-image:url('gray_button.png');
}

I could change the opacity/transparency of the image. How do I "set" a color on Top of this image though?

Any help appreciated.

jolly_nikki
10-21-2009, 11:18 PM
I am not sure if the image color can be changed using CSS.
But you can change the image on mouse over by setting the src attribute to different value using JavaScript. Or change the background of the image


<html>
<head>
<script>
function changecolor(){
document.getElementById("logo").setAttribute("class", "logo");
}

function changecolorback(){
document.getElementById("logo").setAttribute("class", "");
}
</script>

<style>

.logo {
position:absolute;
background-color:blue;
opacity: 0.8;
z-index: 100;
}

</style>
</head>

<body>
<img src = "box.png" onmouseover = "changecolor()" onmouseout = "changecolorback()" id = "logo" />
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum