Internet Explorer의 고정 위치?

모서리 배너와 도구 설명이있는 견본 페이지를 작성했습니다. 모든 것이 파이어 폭스에서 잘 작동합니다. 그러나 IE에서는 정상적으로 작동하지 않습니다. 나는 인터넷 서핑을했고 IE는 위치를지지하지 않는다는 것을 발견했다.
누구든지이 문제를 해결하는 방법을 알고 있습니까?
여기 내 소스 코드Internet Explorer의 고정 위치?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
    <head> 

    <style type="text/css"> 
.tooltip { 
    width: 200px; 
    position: fixed; 
    top:auto; 
    bottom:70px; 
    right:70px; 
    left:auto; 
    font-family: Verdana, Geneva, sans-serif; 
    font-size: xx-small; 
} 
#cornerbanner { 
    position: fixed; 
    top:auto; 
    left:auto; 
    right:0px; 
    bottom:0px; 
} 
    .tooltip .tooltip_top { 
    background-image: url(images/Box_BG_01.png); 
    height: 34px; 
    background-repeat: no-repeat; 
    background-position: center top; 
    line-height: 45px; 
    text-align: right; 
    padding-right: 30px; 
    vertical-align: text-bottom; 
    font-size: xx-small; 
    font-weight: normal; 
    overflow: hidden; 
} 
body { 
    background-color: #F90; 
} 
.content p { 
    font-family: Verdana, Geneva, sans-serif; 
    color: #000; 
    font-size: x-small; 
    text-align: justify; 
    padding: 15px; 
    border: 1px solid #FFF; 
} 
.tooltip .tooltip_top a { 
    text-decoration: none; 
    color: #333; 
} 
    .tooltip .tooltip_con { 
    background-image: url(images/Box_BG_03.png); 
    background-repeat: repeat-y; 
    padding-right: 20px; 
    padding-left: 20px; 
    display: block; 
    clear: both; 
    text-align: justify; 
    letter-spacing: normal; 
} 
.content { 
    width: 800px; 
    margin-right: auto; 
    margin-left: auto; 
} 
    .tooltip .tooltip_bot { 
    background-image: url(images/Box_BG_05.png); 
    height: 24px; 
    background-repeat: no-repeat; 
    background-position: center bottom; 
} 
    .tooltip .tooltip_con #tooltip_link { 
    text-align: right; 
    color: #666; 
    text-decoration: none; 
    margin-top: 10px; 
} 
    .tooltip .tooltip_con #tooltip_link a { 
    color: #666; 
    text-decoration: none; 
} 
    .tooltip .tooltip_con img { 
    float: right; 
    margin-right: 5px; 
    margin-left: 5px; 
} 
    </style> 
    <script src="jquery.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $(".tooltip").fadeOut(0); 
      $("#cornerbanner").mouseover(function(){ 
      $(".tooltip").fadeIn("slow") 
      }); 
      $("#close_tooltip").click(function(){ 
      $(".tooltip").fadeOut(); 
      }); 
     }); 

    </script> 
    </head> 
<body> 
<div class="content"> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vel ligula 
     leo, ac aliquet ante. Sed ut elit et purus ultricies ornare. Sed eu justo sem. 
     Suspendisse convallis elementum eros, vitae consequat lorem sollicitudin vitae. 
     Phasellus bibendum, libero ac semper lobortis, orci tellus lacinia nisl, eget 
     luctus risus felis sed dolor. Phasellus commodo imperdiet neque vitae elementum. 
     Ut iaculis vestibulum velit cursus blandit. Cras ornare iaculis velit, vitae 
     malesuada mi mattis tempor. Ut consequat dapibus massa eget scelerisque. Quisque 
     sed suscipit sapien. Duis metus urna, consequat tempor feugiat sit amet, placerat 
     non lorem. Integer eget urna elit, et ullamcorper libero. In iaculis aliquet</p> 
      <div id="tooltip_link"><a href="http://www.google.com">Click here</a></div> 
      </div> 
      <div class="tooltip_bot"></div> 
    </div> 
</body> 
</html>

출처

2010-01-28 taabouzeid

doctype (http://www.doctype.com)에 대한 더 나은 응답이있을 수 있습니다. –

문제입니다 ~~가장 인기있는~~ 가장 많이 사용되는 브라우저가 있다는 것입니다 - Windows 용 Internet Explorer가 - 그것은, 대신없는 것보다는 나을 것이다 position: absolute;로 되 돌리는을 이해하지 않습니다, CSS 표준에 지정된대로 position: static;으로 되돌아갑니다. 이는 position이 전혀없는 것과 동일한 효과가 있습니다. 베타 2 이후의 IE 7은 position: fixed; (엄격 모드를 트리거하는 문서 유형 선언을 사용하는 경우)을 지원하므로 IE 7을이 수정에서 제외합니다.

출처

2010-01-28 01:06:09 Kieran

"가장 인기있는"은 "가장 많이 사용 된"것과 동일하지 않습니다. IE가 현재 가장 많이 사용됩니다. – Rob

나는 rob에 동의한다. 나는 그것을 개발자로서 싫어한다. 브라우저 자체로서조차 그것은 하위입니다. 일단 정부와 대기업이 더 나은 기능을 많이 사용하면 더 많은 통계가 변경됩니다. – Kieran

"IE6에서 작동하지 않습니까?"

Div.Footer { background-color: #f8f7ef; position:fixed; margin: 0px; padding:4px; bottom:0px; left:0px; right:0px; font-size:xx-small; }

출처

2010-01-28 01:11:56

당신은 종류의 자바 스크립트/jQuery를 사용하여 해킹 수 있습니다 : 나 IE7과 IE8에서 페이지 하단에 바닥 글을 고정하기 위해 다음과 같은 고정 된 위치의 CSS 잘 작동합니다.

예. What is the simplest jQuery way to have a 'position:fixed' (always at top) div?

출처

2010-01-28 01:33:41

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

이렇게하면 맨 위 오른쪽 구석에 요소가 떠있게됩니다. 다른 위치에 배치하려면 에서 0을 변경하여

Internet Explorer 6은 position:absolute을 이해하므로이 작업에 좋은 기초가됩니다. absolute과 fixedpositioning 사이의 유사성은 일반 콘텐츠의 흐름에서이를 제거한다는 것입니다. 그럼 당신은 top과 right 포지션을 정상적으로 사용하고 약간의 자바 스크립트를 사용합니다. 나는 그것이 자바 스크립트를 읽는 방법을 잘 모르겠다. 그러나 누가 신경 쓰는지. 작동합니다;)

출처

2013-03-18 03:17:39

Internet Explorer의 고정 위치?

답변

관련 문제