2010-05-08 3 views
2

현재 여러 서비스 이름이 있고 사용자가 하나의 메뉴를 클릭 할 수있는 간단한 메뉴를 만들고 있습니다. jQuery는 해당 단락을 설명하는 해당 단락을 표시합니다. 내 jQuery 코드는 훌륭하지만 정확히 내가 원하는 것은 수행하지만, 아직 철저히 다룰 수없는 버그가 하나있다.slideDown()은 래퍼 시프트의 모든 것을 만듭니다.

내가이 제목 중 하나를 클릭 할 때마다 페이지의 래퍼에있는 모든 내용이 Firefox에서 약 7 픽셀 왼쪽으로 이동하지만 Chrome과 동일한 작업을 수행하지만 amout은 측정하지 못했지만 그것은 부적절한 것입니다.

어쨌든 slideToggle() 명령을 사용하여 숨겨진 parragraph를 표시하고 있습니다. slideDown이 발생하면 모든 것이 너비가 "margin : 0 auto;"로 바뀌기 때문에 이것이 발생한다고 생각합니다. 내 CSS에서 래퍼 규칙에 대한 설정이 변경 보상입니다. 누구든지이 문제를 해결할 수있는 방법이 있습니까? 인터넷에서 발견 된 여러 가지 수정 사항을 시도했지만 아무 소용이 없습니다.

내 코드는 다음과 같습니다. jsFiddle에 올려 놓으면 쉽게 볼 수 있습니다. http://jsfiddle.net/vcH7m/ 여기에 수정하거나 여기에서 수정해야 할 내용을 게시하십시오. 무엇이든 더 편리합니다. 도움 주셔서 대단히 감사합니다!

+0

+1 테스트 페이지를 제공합니다. 이상한 점은 나는 시프 팅을 복제 할 수 없다는 것입니다 (Mac의 경우 Chrome). – karim79

+0

나는 또한 복제 할 수 없다. Linux의 Firefox 3.6 –

+0

Windows 7의 Fx 3.6.3에서는 시프트가 발생하지 않습니다. – edwin

답변

1

이 이동은 수직 스크롤 막대가 원인 일 가능성이 큽니다. 페이지가 너무 커지면 세로 스크롤 막대가 나타나서 단락의 너비를 왼쪽으로 조금 더 밀어 넣습니다. 브라우저 뷰포트를 약 1000x600으로 축소하면 주어진 jsfiddle 페이지의 첫 번째 단락에서이 효과를 볼 수 있습니다.

이 문제를 해결하려면 고정 된 세로 스크롤 막대를 배치하는 것이 좋습니다.

html { 
    overflow-y: scroll; 
} 
+0

대단히 감사합니다! 이것으로 문제가 완전히 해결되었습니다. 모든 것이 의도 한대로 정확하게 작동합니다. 이런 간단한 수정이 될 것임을 알았습니다. 나는 그것이 무엇인지 알지 못했습니다. 매우 감사! –

+0

반갑습니다. – BalusC

관련 문제