부트 스트랩 '접사'는 늘 내가 여기 예를 들어 만든

오른쪽에 부착 :이 경우, 오른쪽에 뭔가를 부착하고 싶습니다, 기본적으로 http://jsfiddle.net/Ninjanoel/9GEGU/부트 스트랩 '접사'는 늘 내가 여기 예를 들어 만든

을, 빨간색 상자, 난에 원하는 정확한 양의 페이지 스크롤이 발생 했어야 만 정상적으로 고정 될 것처럼 보이지만 매번 '고정'할 때마다 왼쪽으로 이동하여 이미 왼쪽에있는 내용과 겹치게됩니다.

부트 스트랩에 많은 양의 문서가 포함되어 있지만 불행히도이 문제와 관련하여 누락 된 부분이 있습니다. 도와주세요.

var offsetFn = function() { 
    return $('#sidebar').position().top; 
} 

$(document).ready(function(e) { 
    $('#sidebar').affix({ 
     offset: {top: offsetFn} 
    }); 
});

내가 최고 오프셋 값을 추측 할 필요가 없게하는 스택 오버 플로우에서 발견 코드입니다,하지만 난 그것을 사업부가 부착된다 간단한 값을 제공하는 경우에도이 왼쪽으로 이동합니다.

바이올린에 대한 참고 사항 : 잘 작동하지 않는 것 같습니다. 적어도 내 HDD 점프 버전이 남아 있지만, 기본적으로 사용하는 코드이며, 작은 창 크기는 복잡 할 수 있습니다. 녹색 상자와 빨간색 상자는 세로 열이라고 가정합니다.

출처

2012-12-02 Nnoel

사이드 바에 내부 div를 만듭니다. Affix는 열에 position: fixed을 설정하여 작동하지 않게합니다.

편집 : http://jsfiddle.net/9GEGU/2/을 참조하십시오. 기능이 불필요하며 FF에서만 이상한 동작이 발생하므로 {offset: {top: offsetFn}}을 제거하십시오. 그것은 똑같이 보일 것이지만 스크롤은 더 부드럽게 될 것입니다.

또한 요소가 position: fixed 일 때 문서 흐름에서 제거되고 부모의 폭에 의해 제한되지 않기 때문에 #sidebar에 span5 (290px) 너비를 설정하십시오.

출처

2012-12-02 23:54:49

감사합니다. Jan, 나는'{top : 0}'을 설정하고 작동하지만 상자의 너비는 계속 변경됩니다. 여기에 예제가 있습니다 : http://jsfiddle.net/9GEGU/4/, 일부 페이지 너비에서 작동하는 CSS'# sidebar.affix {width : 290px;} '로 너비를 설정했습니다. 다른 사람들에게는 부정확하다. 내 orriginal 질문에 대답했지만, 고마워. – Nnoel

수정 너비를 설정하는 대신 내부 사이드 바에'span5' 클래스를 추가하고 왼쪽 여백을 지울 수 있습니다. http://jsfiddle.net/9GEGU/5/ –

http://twitter.github.com/bootstrap/assets/css/docs.css 접미사 작동 방식을 더 잘 이해하기 위해 부트 스트랩 문서가 미디어 쿼리를 사용하는 방법을 참조하십시오. –

부트 스트랩 '접사'는 늘 내가 여기 예를 들어 만든

답변

관련 문제