"bottom : expression (0+ ...;"for IE 6 고정 위치 지정)

이것은 일부 구문이 누락되었거나 잘못된 것으로 보이는 것처럼 보이지만 ie6 특정 스타일 시트에서는 맨 위에 고정되어 있습니다 뷰 포트의 및 스크롤에도 불구하고 고정 된 상태로 유지 :"bottom : expression (0+ ...;"for IE 6 고정 위치 지정)

top: expression(0+((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px');

을하지만,이 같은 방식으로 바닥에 고정하지 않습니다?

bottom: expression(0+((e=document.documentElement.scrollBottom)?e:document.body.scrollBottom)+'px');

어떤 아이디어

출처

2010-07-27 Fuego DeBassi

전혀 없다 그러한 성질은 scrollBottom.

bottom은 위치 지정된 요소의 아래쪽 가장자리와 포함 블록의 아래쪽 가장자리 사이의 거리입니다. 요소가 다른 위치에있는 요소 내부에 없다고 가정하면이 요소는 초기 포함 블록이며 실제로는 초기 뷰포트입니다.

그래서 아래로 초기 (위) 위치에서 뷰포트 스크롤의 bottom 위치가 일치하도록 아래쪽으로 이동 부정적인 될 필요가 때

// set from script. This is much more reliable than sniffing for 
// scrollTop being zero. If your page has a Standards Mode doctype, 
// which in this century it really should, then you don't need this, 
// you can just always use document.documentElement. 
// 
var root= document.compatMode==='CSS1Compat'? document.documentElement : document.body; 

/* then: */ 
top: expression(root.scrollTop+'px'); 

/* or: */ 
bottom: expression(-root.scrollTop+'px');

그러나 또 다른 IE6 버그 곳이 절대 위치 요소의 스타일을 bottom으로 설정하면 실제로 초기 뷰포트 위치 대신 현재 뷰포트 위치에 상대적입니다. 그래서 실제로는 0 ...으로 설정 되었더라도 bottom을 설정하면 항상 0이됩니다.

나는 개인적으로 여전히 expression을 IE6 전용 해킹으로 사용하지 않을 것입니다. 항상 재 계산해야 할 때를 알 수는 없으므로 매우 신뢰할 만합니다. 나에게는 스크롤에 대한 표현식 재 계산이 보통 없다. 리 커서를 트리거하지 않는 문서 크기를 변경하는 일부 크기 조정, 텍스트 크기 조정 또는 DOM 작업도 있습니다. 스크립트에서 onscroll 및 onresize을 잡으려고

더 나은은 재배치를 호출하고 이벤트에서 잡은 될 수없는 다른 경우 위해를 업데이트 느린 setInterval 폴러를 추가 할 수 있습니다.

예제 코드 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"><head> 
    <style type="text/css"> 
     body { margin: 0; } 
     #tools { 
      position: fixed; z-index: 9; 
      bottom: 0; left: 0; width: 100%; height: 24px; 
      background: silver; 
     } 
    </style> 
</head> 
<!--[if lte IE 6]><body class="ie6"><![endif]--> 
<!--[if gte IE 7]><!--><body><!--<![endif]--> 
    <div id="tools">...</div> 
    ... 

    <script type="text/javascript"> 
     // IE6 position: fixed fix 
     // 
     function fixFixed(element, isbottom) { 
      var root= document.compatMode==='CSS1Compat'? document.documentElement : document.body; 
      function setPosition() { 
       if (isbottom) 
        element.style.top= (root.scrollTop+root.clientHeight-element.offsetHeight)+'px'; 
       else 
        element.style.top= root.scrollTop+'px'; 
      } 
      element.style.position= 'absolute'; 
      window.attachEvent('onscroll', setPosition); 
      window.attachEvent('onresize', setPosition); 
      window.setInterval(setPosition, 5000); 
     } 

     if (document.body.className==='ie6') 
      fixFixed(document.getElementById('tools'), true); 
    </script> 
</body></html>

출처

2010-07-28 00:31:21 bobince

당신이 IE 6에서 뷰포트의 바닥에 '고정'상태를 유지하기 위해 바닥 글을 강제로 사용할 수있는 솔루션을 게시 할 수 있을까요? –

(내가 사용하는 것과 유사한 코드가 추가되었습니다.) – bobince

"bottom : expression (0+ ...;"for IE 6 고정 위치 지정)

답변

관련 문제