2013-01-15 3 views
0

IE8 이하에서 작동하지 않는 다음 2 가지 코드가 있습니다.IE8 이하에서 jQuery 코드가 작동하지 않습니다.

4 가지 서비스 모두 항상 활성 클래스이므로 실패합니다. 또한 다음 코드에서 콜백 함수는 완성 된 클래스를 추가하지 않습니다.

webform.click(function() {     
    if(!$(this).hasClass('expanded')) { 
      $(this).addClass('expanded'); 
      $(this).animate({ 
       marginLeft: '-25%', 
       width: "50%", 
       minWidth: '400px', 
       maxWidth: '700px', 
       padding: '0', 
       minHeight: "580px", 
       height: 'auto', 
       borderRadius: "0" 
      }, 1000, function() { 
       $(this).addClass('completed'); 
      }); 
     } 
    }); 

는 사람이 내 코드는 IE 호환되는지 확인하기 위해 더 중요한 것은 내가 앞으로 무엇을해야하는지 어떻게이 문제를 해결하는 방법 말해, 할 수 있습니다.

위와 비슷한 jQuery/IE 문제가있는 사용자는 위의 마지막 옵션 (예 : borderRadius: "0" 이후) 뒤에 쉼표를 넣는 것이 큰 문제였습니다. IE를 제외한 모든 브라우저에서 무시됩니다.

+0

당신이'services'과를 정의하는 코드를 보여줄 수'웹 양식

두 인수를 사용하여 hover()

services.hover(function() { /* add on mousenter, remove on mouseleave */ $(this).toggleClass('active'); }); 

다른 방법이 시도 '이 요소의 HTML도 도움이 될 수 있습니다. –

+0

콘솔에서 어떤 오류가 발생합니까? 'max/min' 속성을 애니메이트하는 것이 맞는지, IE 7 & 8이'borderRadius'를 지원하지 않는지 확실치 않습니다. 브라우저 지원을 먼저 확인하고 그에 따라 객체를 정의 할 수 있습니다. 'max/min' 속성을 설정하기 위해 클래스를 사용하도록 제안하십시오. – charlietfl

+1

후행 쉼표에 대한 이전 IE 오류는 전혀 새로운 것이 아닙니다. [JavaScript의 쉼표 후행] (http://stackoverflow.com/q/7246618/1331430)을 참조하십시오. 이제 실제 문제는 제공된 코드만으로는 충분하지 않습니다. jsfiddle/jsbin/codepen/dabblet/tinkerbin과 같은 실시간 시나리오에서 문제를 재현 해보십시오. 게시 한 겉으로보기에 유효한 코드만으로 문제를 추론하는 것은 불가능합니다. –

답변

1

Hover problem-

hover() 2 개 인자, mouseenter에 대한 하나 mouseleave 하나를합니다. 하나의 함수 만 인수로 제공하면 두 이벤트 모두에 대해 실행됩니다.

요소 컬렉션에서 메서드를 실행하는 데 each이 필요하지 않습니다. jQuery는 컬렉션의 모든 요소를 ​​내부적으로 반복합니다.

services.hover(function() { 
     /* add on mousenter */ 
     $(this).addClass('active');     

}, function(){ 
     /*remove on mouseleave */ 
     $(this).removeClass('active'); 
}); 

API 참조 : http://api.jquery.com/hover

관련 문제