개체에 적용된 필터(filter)나 필터들의 컬렉션(filters)을 반환하거나 설정한다.
![]() | Script | object.style.filter=[sVal] |
HTML | <ELEMENT style="filter:sVal;"> | |
CSS | cssSelector {filter:sVal;} |
filtertype1 (parameter1, parameter2,...) | 등록된 필터이다. |
filtertype2 (parameter1, parameter2,...) | 등록된 필터이다. |
이 속성은 읽기/쓰기이며 디폴트값은 없다.
CSS(Cascading Style Sheets) 애트리뷰트는 상속되지 않는다.
필트가 표현되기 위해서는 개체는 배치(layout)를 가져여 한다. 배치를 갖게하기 위한 간단한 방법은 엘레멘트에 height 혹은/과 width 속성을 설정하는 것이다. 다른 방식으로 엘레멘트가 배치를 갖게하는 방법들이 있다. 추가적인 정보는 hasLayout 속성을 참조하라.
예를들어 이미지 모체 개체에 필터를 설정하므로서 img 개체에 Shadow 필터를 적용할 수 있다.
이 속성은 Macintosh 플랫크폼에서는 지원되지 않는다.
개체 | script | CSS | IE 버전 |
---|---|---|---|
a | a.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
acronym | acronym.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
address | address.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
b | b.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
bdo | bdo.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
big | big.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
blockQuote | blockQuote.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
body | body.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
button | button.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
caption | caption.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
center | center.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
cite | cite.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
code | code.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
custom | custom.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
dd | dd.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
del | del.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
dfn | dfn.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
dir | dir.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
div | div.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
dl | dl.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
dt | dt.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
em | em.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
fieldSet | fieldSet.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
font | font.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
form | form.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
frame | frame.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
hn | hn.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
iFrame | iFrame.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
frameSet | frameSet.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
i | i.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
ins | ins.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
img | img.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
button | button.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
checkbox | checkbox.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
FileUpload | FileUpload.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
image | image.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
password | password.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
radio | radio.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
reset | reset.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
submit | submit.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
text | text.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
kbd | kbd.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
label | label.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
legend | legend.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
li | li.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
marquee | marquee.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
menu | menu.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
noBR | noBR.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
ol | ol.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
p | p.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
plainText | plainText.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
pre | pre.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
q | q.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
rt | rt.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
ruby | ruby.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
s | s.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
samp | samp.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
small | small.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
span | span.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
strike | strike.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
strong | strong.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
sub | sub.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
sup | sup.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
table | table.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
textArea | textArea.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
th | th.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
td | td.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
tt | tt.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
u | u.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
ul | ul.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
var | var.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
xmp | xmp.style.filter[=sVal] | cssSelector{filter:sVal} | IE5(win32,ce) |
이 속성은 CSS(Cascading Style Sheets)의 부분에 포함시킬 것이 제안되었다.
![]() | filter 스타일속성⇒ | ![]() | ![]() ![]() ![]() |
<IMG id="imgObj" src="../../gif/flower.jpg" style="filter:progid:DXImageTransform.Microsoft.MotionBlur(strength=150) progid:DXImageTransform.Microsoft.BasicImage(mirror=2)" width="300px" border="0"> <BR> <SCRIPT> str='imgObj.filters.length='+imgObj.filters.length+'<BR>'; str+=imgObj.style.filter+'<BR>'; document.write(str) </SCRIPT>
이미지를 클릭해보라.
<SCRIPT> function doFilter(){ filterFrom.filters.item(0).Apply(); filterFrom.filters.item(0).Transition=12; imgOne.style.visibility='hidden'; filterTo.style.visibility=''; filterFrom.filters.item(0).play(10); } </SCRIPT> <DIV id="filterFrom" onClick="doFilter()" style="position:absolute;width:300px;height:225px;filter:revealTrans()"> <IMG id="imgOne" style="position:absolute;width:300" src="../../gif/flower1.jpg"> <DIV id="filterTo" style="position:absolute;background:white;visibility:hidden;"></DIV> </DIV> <BUTTON style="position:relative" onclick="imgOne.style.visibility='';filterTo.style.visibility='hidden';doFilter()">다시 시작</BUTTON>
![]() | filter 스타일속성 | ⇒ | ![]() ![]() |
최종 수정: 07/11/2025 10:46:25 | ![]() All right reserved | 비정상적인 방식으로 프레임없이 페이지에 접속하면 자주 오류가 발생됩니다. 오류가 나면 정상적 접속으로 시도해 보세요. | http://koxo.com/lang/js/style/filter.html |