그라디언트가 IE에는 적용되지 않는다.

Question

나는 매우 일반적인 질문을 가지고 있으며, 모든 것을 다 검색하고, 거의 모든 것을 시도했다. 디스플레이 : 블록, 줌 : 1, 높이 설정, 너비는 아무 것도 작동하지 않았다. 나는 실제로 팝업으로, 자바 스크립트와 jquery 벽으로 만든 테이블이 있습니다. 다음은 간단한 코드 예제입니다.

$(tr1).css('width','210px'); 
$(tr1).css('height','63px'); 
$(tr1).addClass('testClass'); 
$(tr1).css('border-bottom','solid 1px #c6c7c5'); 
$(tr1).mouseover(function(){ 
    $(tr1).css('cursor','pointer'); 
}); 

$(tr1).click(function(){ 
    open_report('EXCEL',sparam); 
    popUpIsOpen = false; 
    removePopupBtn(); 
    $(wrapperBox).remove(); 
}); 

$(tr2).css('width','210px'); 
$(tr2).css('height','63px'); 
$(tr2).addClass('testClass'); 

는 그리고 이것은 내 CSS를 IE (모든 버전) ... 어떤 도움을 이해할 수있을 것이다 제외한 모든 브라우저에서

.testClass{ 
width: 210px; 
height: 63px; 
zoom: 1; 
display: block; 
background-repeat: no-repeat; 

background: -webkit-gradient(linear, left top, left bottom, from(#dcdedb), to(#c9cbc8)); 
background: -moz-linear-gradient(top, #dcdedb, #c9cbc8); 
background-image: -o-linear-gradient(top, #dcdedb, #c9cbc8); 
background: -ms-linear-gradient(top, #dcdedb 0%,#c9cbc8 100%); 
background: linear-gradient(top, #dcdedb 0%,#c9cbc8 100%); 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dcdedb', endColorstr='#c9cbc8',GradientType=0); 
} 

.testClass:hover { 

background: -webkit-gradient(linear, left top, left bottom, from(#eaebea), to(#d6d7d5)); 
background: -moz-linear-gradient(top, #eaebea, #d6d7d5); 
background-image: -o-linear-gradient(top, #eaebea, #d6d7d5); 
background: -ms-linear-gradient(top, #eaebea 0%,#d6d7d5 100%); 
background: linear-gradient(top, #eaebea 0%,#d6d7d5 100%); 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaebea', endColorstr='#d6d7d5',GradientType=0); 
} 

일입니다! :)

---

추가하는 GradientType = 0 필터에서 여전히 작동하지 않습니다.

Answer 1

이 당신의 CSS를 변경

하고의

WORKING FIDDLE

.testClass { 
    width: 210px; 
    height: 63px; 
    zoom: 1; 
    display: block; 
    background-repeat: no-repeat; 
    background: #dcdedb; 
    /* Old browsers */ 
    background: -moz-linear-gradient(top, #dcdedb 0%, #c9cbc8 100%); 
    /* FF3.6+ */ 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dcdedb), color-stop(100%, #c9cbc8)); 
    /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(top, #dcdedb, #c9cbc8 100%); 
    /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(top, #dcdedb 0%, #c9cbc8 100%); 
    /* Opera 11.10+ */ 
    background: -ms-linear-gradient(top, #dcdedb 0%, #c9cbc8 100%); 
    /* IE10+ */ 
    background: linear-gradient(to bottom, #dcdedb 0%#c9cbc8 100%); 
    /* W3C */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dcdedb', endColorstr='#c9cbc8', GradientType=0); 
    /* IE6-9 */ 
} 
.testClass:hover { 
    background: #eaebea; 
    /* Old browsers */ 
    background: -moz-linear-gradient(top, #eaebea 0%, #d6d7d5 100%); 
    /* FF3.6+ */ 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eaebea), color-stop(100%, #d6d7d5)); 
    /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(top, #eaebea 0%, #d6d7d5 100%); 
    /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(top, #eaebea 0%, #d6d7d5 100%); 
    /* Opera 11.10+ */ 
    background: -ms-linear-gradient(top, #eaebea 0%, #d6d7d5 100%); 
    /* IE10+ */ 
    background: linear-gradient(to bottom, #eaebea 0%, #d6d7d5 100%); 
    /* W3C */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaebea', endColorstr='#d6d7d5', GradientType=0); 
    /* IE6-9 */ 
} 

SCREENSHOT 작동합니다 IE7의 작업 코드

Answer 2

IE에서 CSS3Pie를 사용하여 CSS3 (그라디언트 & ...)을 사용할 수 있습니다.

CSS3Pie 사이트 : http://css3pie.com

하고 쉽게사용

<!--[if IE]> 
    <link rel="stylesheet" type="text/css" href="your-css3pie-file.css" /> 
<![endif]-->