2010-03-07 6 views
6

자바 스크립트에서 이미지의 투명도를 설정할 수 있습니까? 어떻게하면됩니까?투명 이미지 - JS에서 가능합니까?

+0

당신은 어떤 자바 스크립트 라이브러리/프레임 워크를 사용하고 계십니까을, 아니면 그냥 바닐라 JS? 나에게 –

+0

JS는 원시 자바 스크립트입니다. 그래서 나는 어떤 것도 사용하지 않고있다. – oneat

답변

8

만약이 작동합니다 자바 스크립트 일반 사용 :

function SetOpacity(imageid, opacity) { 
    var s= document.getElementById(imageid).style; 
    s.opacity = (opacity/100); 
    s.MozOpacity = (opacity/100); 
    s.KhtmlOpacity = (opacity/100); 
    s.filter = 'alpha(opacity=' + opacity + ')'; 
} 

전화로 : SetOpacity('myImg', 50); //Half transparent

Source here

+0

불투명도/100에 대한 변수를 사용하는 것이 더 효율적일까요? var decentBrowserOpacityValue = 불투명도/100, 또는 불투명도가 0-1 사이의 값이되도록하고 s.filter = 'alpha (불투명도 ='+ (불투명도 * 100) + ')'; – KooiInc

+0

@Kooilnc - 아마도 변수 할당이 1 개이고 3 개 부문보다 1 개 저렴할까요? 나는 잘 모르겠다. 그러나 나는 그것이 극소의 작은 차이라고 생각한다. 이 경우 대부분의 작업은 브라우저의 렌더링 엔진으로 이미지를 투명하게 만듭니다. 여기에 변수 할당의 차이는 코드를 쉽게 읽을 수 없도록 만드는 마이크로 최적화로,이 단순한 경우에 머물러있는 경향이 있습니다. . –

+0

@ 닉 크레이버 - 실제로 마이크로이지만, 어떻게인지 알 수 있습니다. 많은 마이크로가 큰 것을 만드는 경향이 있습니다. 또 다른 요점은 함수의 '마이크로 소프트 지향성'일 수 있는데, 나는 OR 절에서 강조했다. 글쎄, 그건 내가 생각하는 맛의 문제 야. – KooiInc

3

예. jQuery 사용

:

$('#yourImageId').css('opacity', .5);