web development helpdesk

Here is a quick reference on setting the opacity of html elements using CSS, Javascript and JQuery.

.someClass {
   opacity: 0.6;
   
   /* For IE8 */
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=60)"; 
   /* For IE6 - 8 NB. Element needs to have layout */
   filter: alpha(opacity=60);
}

To change the CSS Opacity with Javascript

 // for most browsers
document.getElementById("myElement").style.opacity = ".4";
// for IE
document.getElementById("myElement").style.filter = "alpha(opacity=40)"; 

To change the CSS Opacity with JQuery

$(".someClass").css({ opacity: .4 });

// or we can animate the change

$("#myElement").animate({
	opacity: .4
	}, 1000, function() {
});

written by objects \\ tags: animate, opacity