jQuery 아코디언 + 앵커 태그 '블록으로 붙어서'버그?

샘플 페이지는 :jQuery 아코디언 + 앵커 태그 '블록으로 붙어서'버그?

이것은 간단한 jQuery를 UI 아코디언이다. 각 아코디언 패널은 UL이 마크 업 (AN OL가 동일하게 작동)이 있습니다 IE6에서

<ol> 
     <li><a href="">Lorep ipsum dolor lorem ipsum dolor lorem ipsum dolor</a>?</li> 
     <li><a href="">Lorep ipsum dolor lorem ipsum dolor lorem ipsum dolor</a>?</li> 
</ol>

, 당신은 < > 태그가 블록 요소로 렌더링지고있는 것으로 보인다 것을 볼, 그래서 질문 있습니다 마크는 텍스트 줄 끝이 아닌 바깥쪽으로 밀려납니다. 또한 글 머리 기호 및/또는 목록 항목 번호가 맨 위에 정렬되지 않고 텍스트와 하단 정렬됩니다.

나는 아코디언을 만들기 위해 실행되는 javascript로 범위를 좁혔습니다. JQuery CSS를 사용하지 않으면 문제가 해결되지 않는 것이 문제가 아닙니다.

누군가이 렌더링 문제가 발생하기 위해 IE6에서 어떤 일이 벌어지고 있는지 알 수 있습니까?

업데이트 : 분명히 IE7 문제이기도합니다.

UPDATE 2 :

버그 목록과 아무 상관이 : 좀 더 연주 후, 나는 좀 더 일을 좁혀했습니다. 문제는 jQuery Accordion 내의 모든 앵커 태그가 display : block으로 표시된다는 것입니다 (CSS가 계속 display : inline을 표시한다고해도)
jQuery UI에서 사용하는 실제 CSS와는 아무런 관련이 없습니다 아코디언을 만듭니다. 완전히 렌더링 된 jQuery Accordion 사후 처리 된 소스 코드와 함께 제공되는 CSS를 사용하는 테스트 페이지를 만들었습니다. 이 상황에서 앵커 태그는 인라인으로 유지됩니다.

결론 : 자바 스크립트를 통해 아코디언을 렌더링하는 프로세스가 앵커 태그의 표시를 엉망으로 만드는 것으로 보입니다. 표시/숨기기 문제 일 수 있습니까?

출처

2010-04-14 DA.

솔루션 :

그것을 IE6와이 레이아웃 문제가 있다고 (놀라운)을 밝혀 없습니다. jQuery UI가 Accordion을 빌드하기 위해 시작되면 어떻게 든 앵커 태그는 레이아웃을 잃게됩니다 (또는 has-layout이 제공됩니까?). 해결책은 그것을 가지고있는 (내가 생각하기에) has-layout을 가지고 있지 않은 콜백 함수를 추가하는 것이다 :

$('.myDiv').accordion({ 
    collapsible: true, 
    autoHeight: false, 
    active: false, 
    change: function(){$(this).find('a').css('zoom','0')} 
    });

출처

2010-04-16 21:34:42

jQuery 아코디언 + 앵커 태그 '블록으로 붙어서'버그?

답변

관련 문제