2010-01-29 4 views
0

나를 용서하십시오. 여기에 초급 질문을 추가하는 것이 싫지만, 아아, 나는 붙어 있습니다. 나는 왼쪽으로 그리고 화면에서 (배경 이미지를 포함하여) 많은 것을 미끄러지려고하는데, 효과적으로 제어판 (#navCol)을 토글하고 메인 영역을 더 크게 만든다. (.mainLarge로).jQuery : 한 번의 클릭으로 여러 항목 전환 (멍청이)

Firefox에서는 작동하지만 IE에서는 작동하지 않습니다. 나는 jQuery로 초보자이지만 html/css가 아니라는 점에 유의해야한다. 그리고 현재의 CSS 설정은 불쾌 해 보이지만이 프로젝트에서는 피할 수 없다. IE에서 토글 링크를 누를 때마다 일부 애니메이션 만 발생하기 때문에 jQuery가 잘못되었다고 생각합니다. 다시 클릭하면 다른 것들이 클릭됩니다.

무엇인가를 명확히해야 할 경우 알려 주시면 감사하겠습니다.

$('a#nav-toggle').click(function() { 
    $('#navCol').toggle('slide',400); 
    $('#main').toggleClass('mainLarge', 530); 
    $('body').toggleClass('backgroundOffset', 500); 
    return false; 
}); 

맞습니까? 다음은 HTML입니다 :

<body> 
<div id="horNav"> 
<ul id="navigation"> 
... 
</ul> 
</div> 
<div id="navCol"> 
Left Col 
</div> 
<div id="main" class="main"> 
Main Col 
<a href="#" id="nav-toggle"><-></a> 
</div> <!-- End main --> 
</body> 

그리고 여기에 CSS의 :

body { 
    background: #f1f1f1 url(/images/shadow.png) repeat-y top; 
    background-position: 400px 0px; 
} 

.backgroundOffset{ 
    background-position: 55px 0px; 
} 

#navCol{ 
    background: #eaeaea; 
    color: #000000; 
    height:100%; 
    left:0px; 
    margin-right:40px; 
    position:fixed; 
    top:0; 
    width:400px; 
    padding-top: 70px; 
} 

.main{ 
    padding-left: 460px; 
    padding-top: 100px; 
    padding-right: 100px; 
} 

.mainLarge{ 
    background-position: 55px 75px; 
    padding-left: 115px; 
} 
+0

IE의 버전은 무엇입니까? 필자는 코드를 문서에 넣었으며 FF3.5와 IE7에서 똑같이 작동했습니다. – Erik

+0

또 다른 noobtastic 오류 - 나는 충돌하는 다른 jquery를했습니다. 내가 그것을 제거했을 때, 당신이 말한 것처럼 효과가있었습니다. 작동하는지 확인해 주셔서 감사합니다. –

답변

1

사용하는 jQuery를 버전은 무엇? 이러한 메소드는 jQuery 1.3+에 대한 올바른 매개 변수가없는 것처럼 보입니다. 나는 그것이 더 좋을 것이라고 생각할 것이다 :

$('a#nav-toggle').click(function() { 
    $('#navCol').slideToggle(400); 
    $('#main').toggleClass('mainLarge'); 
    $('body').toggleClass('backgroundOffset'); 
    return false; 
}); 

클래스 토글을위한 속도는 제공 할 수 없다. 표준 두 번째 인수는 새 값의 설정 또는 해제 여부를 나타내는 플래그입니다.

+0

흥미 롭습니다. 속도가 Firefox의 토글에 영향을 미치는 것 같습니다. 팁을 주셔서 감사합니다! 따라서 요소를 슬라이드하려면 jQuery에서 철자를 익히고 클래스를 사용하여 시도하지 않아야합니다. –

+0

슬라이드로 말하자면, 스냅이 아니라 움직이는 것을 의미합니다. –

+0

예, 실제로 위치를 특정 위치로 슬라이드 시키려면 애니메이션 기능을 사용하고 끝낼 위치를 지정해야합니다. – tvanfosson

관련 문제