예를 들어, Taobao 제품 세부 정보에서 스크롤 막대를 내리면 제품 세부 정보와 평가 탐색 기능이 수정됩니다. 이제 많은 웹사이트에서 비슷한 효과가 나타납니다. Yuanfang도 마찬가지입니다. 인터넷에서 코드를 검색한 결과 그 중 많은 코드가 지저분하고 쓸모가 없다는 사실을 발견했습니다. 그래서 제가 직접 작성해보았는데, 코드가 몇 줄로 아주 간단하지만, 아쉽게도 IE6과 호환되는 예제가 있다면 조언 부탁드립니다. 코드만 게시하세요. 코드 복사 코드는 다음과 같습니다. demo <br>$(문서).ready(함수( ){ <br>var added = true; <br>var top = $("#demo").offset().top <br>function Add_Data() <br>{ <br>var scrolla=$(window ).scrollTop () <br>var cha=parseInt(top)-parseInt( scrolla) <br>if(loaded && cha<=0) <BR>{ <BR>$("#demo").removeClass ("demo2 ").addClass("demo1"); <BR>$("#demo").html("지금은 파란색입니다. 스크롤 막대를 위로 당기면 빨간색으로 표시됩니다. 수정했습니다.") ; <BR>loaded=false; <BR>} <BR>if(!loaded && cha>0) <br>{ <br>$("#demo").removeClass("demo1").addClass("demo2 " ; 🎜>} <br>} <br>$(window).scroll(Add_Data); <br>}); <br> .demo <BR>{ <BR>테두리: 1px <BR>너비: 300px; <BR>오버플로: 자동; 왼쪽; <BR>배경 색상: #ffffff; <BR>} <BR>.demo1 <BR>{ <BR>위치: <BR>_위치: 절대; : 0px ; <BR>배경색: #0000ff; <BR>폭:300px <BR>색상:#ffffff; <BR>.demo2 <BR>테두리: 1픽셀 #dcdcdc; <BR>여백: 10px; <BR>오버플로: <BR>배경색: #ff0000; <BR>높이:200px <BR>색상:#ffffff; <BR>} <BR></head> <br><div class= "데모"> <br></div> <br></div> <br><div class="demo"> < /div> <br><div class="demo"> <br></div> <br><div class="demo2" id="demo"> 이제 아래로 스크롤하면 파란색으로 표시됩니다. 아직 고치지 않았습니다. <br></div> <br><div class="demo"> <br></div> <br><div class="demo"> <br><div class="demo"> <br></div> <br></div> "데모"> <br></div> <br></html> <br><br> <br>실제로는 간단한 데모만 제공합니다. 개발 중에도 데모의 내용을 수정해야 합니다. <br>온라인 데모: <br>http://demo.jb51.net/js/2012/scrollfixed/<br><br>첨부파일: <br>데모 다운로드<br> </div>