4

스크롤 할 수있는 div (기본 페이지에는 스크롤바가 없음)와 스크롤 할 수있는 내용의 jQuery UI 버튼이있다. IE6과 IE7에서는 버튼이 div의 내용으로 스크롤되지 않고 올바른 위치에 있지 않을 때 마우스를 올려 놓으면 재미있는 일을합니다. 여기 IE6과 IE7에서 div를 스크롤 할 때 jQuery UI 버튼이 움직이지 않는다 (때때로 사라진다)

은 (jQuery를 1.5 헤더에 포함되어 있음) 예입니다 :

<link rel="stylesheet" type="text/css" href="Lib/jquery-ui-1.8.10.custom.min.css" /> 
<script type="text/javascript" src="Lib/jquery-1.5.min.js"></script> 
<script type="text/javascript" src="Lib/jquery-ui-1.8.10.custom.min.js"></script> 

<div style="width: 400px; height: 300px; overflow: scroll;"> 
    <div style="width: 400px; height: 1200px;"> 
     Hello world<br /><br /> 
     <a href='#' id='test'>test button</a> 
    </div> 
</div> 
<script> 
    $('#test').button(); 
</script> 

내가 해결 방법을 찾았지만, 그것은 완벽 하진; 스크롤 이벤트를 catch하고 .button('enable')을 button 요소에 호출합니다 (어떤 이유로 .button('refresh')은 아무 것도하지 않았습니다). 버튼이 올바르게 스크롤되지만 이제는 스크롤 할 때 div의 바깥쪽에 표시됩니다 (div 위쪽으로 스크롤되어 여전히 표시됨). 여기에 코드입니다 :

<link rel="stylesheet" type="text/css" href="Lib/jquery-ui-1.8.10.custom.min.css" /> 
<script type="text/javascript" src="Lib/jquery-1.5.min.js"></script> 
<script type="text/javascript" src="Lib/jquery-ui-1.8.10.custom.min.js"></script> 

<div class='scrollingDiv' style="width: 400px; height: 300px; overflow: scroll;"> 
    <div style="width: 400px; height: 1200px;"> 
     Hello world<br /><br /> 
     <a href='#' id='test' class='scrollingButton'>test button</a> 
    </div> 
</div> 
<script type="text/javascript"> 
    $(function(){ 
     $('#test').button(); 

     $('.scrollingDiv').scroll(function() { 
      $('.scrollingButton').button('enable'); 
     }); 
    }); 
</script> 
+0

어디에있어서 "버튼"정의? 내가 말할 수있는 한 jQuery의 일부가 아닙니다. –

+0

in jQueryUI (코드에서 명확하지 않지만 첫 번째 문장에서 언급) – ttubrian

+0

흠. 이상하게도 jQueryUI를 내 피들에 추가했지만 아직 버튼을 지원하지 않습니다. http://jsfiddle.net/bhofmann/9pPa8/ –

답변

4

이것은 jQuery를 http://bugs.jqueryui.com/ticket/5281 해결 방법은 스크롤링 position:relative; 컨테이너를 설정하는

버그에 관련된 것으로 보인다.

jQuery 티켓에 fracmak이 주석을 달았습니다. IE7에는 넘치는 div (스크롤 및 숨김) 문제가 있습니다. 이것은 사용자 버튼 컨트롤이 실제로 제어/감지 할 수있는 것이 아닙니다.

-3

난 당신이 스크립트 태그의 시작 부분에 추가 할 생각은, 다음과 같은 문장 :

$(function(){ 

여기에 코드

});

이것은 DOM (페이지) 준비가 완료되면 스크립트가로드됨을 의미합니다.

당신은 또한 태그를 추가 할 수있는 속성 유형 = "텍스트/자바 스크립트"

내가 그 일을 생각!

+1

Downvoted 왜냐하면 [a] 해결하지 못합니다. 문제, [b]는 단지 제안 일뿐입니다. 재현을 시도한 다음 답변을 게시하기 전에 문제를 해결하십시오. –

+0

좋은 추가 사항이지만 문제를 해결하지 못했습니다. 댓글 주셔서 감사합니다 :) – toby

관련 문제