CODEWITHSUNDEEP
javascriptjquery
Kyle
Kyle

Reputation: 22045

javascript - change the alpha of an image

How can I change the alpha of an image in javascript? Also, what browsers support this?

Upvotes: 5

Views: 2648

Answers (3)

Pekka
Pekka

Reputation: 449475

The property's name is opacity and is supported by all major browsers, however in various different forms - opacity, -moz-opacity (FF pre 2.0 I think), filter (IE) and so on.

The easiest way to take is using a JavaScript Framework like jQuery or Prototype, they have a .opacity() function that takes care of the quirks.

Upvotes: 0

SLaks
SLaks

Reputation: 887449

Using jQuery:

$(something).css('opacity', 0.5);

This will work in every browser.
However, it will not work properly with semi-transparent PNG images in IE 7 and 8 unless they are applied using a filter.

Upvotes: 9

Francisco Soto
Francisco Soto

Reputation: 10392

I don't think you can change the alpha of the image itself, but you can change it from the tag, or the container in which you put it.

The particular css properties I use for this are :

filter:alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
opacity: 0.5;

Upvotes: 3

Related Questions