Jquery Internet Explorer 호환성 (토글 및 애니메이션)

이 작은 jQuery 코드가 Internet Explorer에서 작동하지 않는 이유는 무엇입니까? IT는 모든 Webkit 브라우저에서 잘 작동합니다.Jquery Internet Explorer 호환성 (토글 및 애니메이션)

$('#logo').toggle(function() { 
    $('#about').animate({'top': '-400px'},'slow'); 
}, function() { 
    $('#about').animate({'top': '0px'},'slow'); 
});

CSS :

#logo { 
    margin:-55px auto 0 auto; 
    cursor:pointer; 
} 

#about { 
    width:100%; 
    height:200px; 
    position:fixed; 
    top:0px; 
    z-index: 3000; 
}

HTML

<div id="header"> 
    <div id="about">     
    <p>test</p> 
    <img id="logo2" src="assets/img/logokleinhover.png" alt="Logo" /> 
    </div> 
</div>

출처

2010-08-23 Jeroen

어떻게 html과 CSS를 설정 했습니까? – Nalum

당신은 로고의 ID와 함께 아무것도 가지고 있지 않습니다 ... – Patricia

"해시 태그를 제거했습니다"- 왜? –

Nalum가 사라지고 복구 할 수 높이 400 픽셀보다 이미지가 더 적은 말처럼. 그러나이 코드 조각은 나를 위해 IE 7 및 IE 8에서 작동 :

<!DOCTYPE html> 
<html><head> 
<script type="text/javascript" src="jquery-1.4.2.js"></script> 
<style> 
#logo { 
    margin:-55px auto 0 auto; 
    cursor:pointer; 
} 
#about { 
    width:100%; 
    height:200px; 
    position:fixed; 
    top:0px; 
    z-index: 3000; 
} 
</style> 
</head> 
<body> 
<div id="header"> 
    <div id="about"> 
    <p>test</p> 
    <img id="logo" src="test.bmp" alt="Logo" /> 
    </div> 
</div> 
<script language='javascript'> 
    $('#logo').toggle(
    function(){ 
     $('#about').animate({'top': '-400px'},'slow'); 
    }, 
    function(){ 
     $('#about').animate({'top': '0px'},'slow'); 
    }); 
</script></body></html>

일에 스크립트가 영향을 미칠 것이다 html로 이하로 가지고 어떤 이유로 주목. 나는 이것이 examples에서 사실임을 알아 냈고 영향을 미치는 태그 위에 스크립트를 두려고 할 때 작동하지 않을 것입니다. IE7에서는 제대로 작동하지 않는다는 의견이 있지만이 경우에는 그렇지 않습니다.

출처

2010-08-26 17:44:44

작동하려면 html 위에'$ (document) .ready (function() {.....});에 자바 스크립트를 넣어야합니다. – Nalum

HTML 페이지 하단의 $ (document) .ready()에 코드를 삽입하는 경우. IE에서 js와 관련된 많은 문제를 줄여줍니다.

Jack이 말했듯이, HTML을 적용한 후에 자바 스크립트를 적용하는 것이 가장 좋습니다.

<script> 
$.ready(function(){ 
    $('#logo').toggle(function() { 
     $('#about').animate({'top': '-400px'},'slow'); 
    }, function() { 
     $('#about').animate({'top': '0px'},'slow'); 
    }); 
}); 
</script>

출처

2010-08-28 13:11:24 SethZanderJensen

Jquery Internet Explorer 호환성 (토글 및 애니메이션)

답변

관련 문제