고정 정렬 문제

Question

어떻게하면 모든 화면 해상도에서 왼쪽의 컨테이너 div로 고정 된 div 스틱을 만들 수 있습니까? 내가 제대로 이해한다면 확실하지

#container{ 
    background-color:#000; 
    filter:alpha(opacity=85); 
    -moz-opacity: 0.85; 
    opacity: 0.85; 
    width:1000px; 
    min-height:1275px; 
    height:100%; 
    margin:auto; 
} 

#fixed{ 
    position: fixed; 
    top:150px; 
} 

Answer 1

CSS 속성이 고정되어서는 다소 불가능하지만, 컨테이너 div의 위치를 ​​고정 div div로 지정하고 Jquery로 고정 효과를 시뮬레이트합니다. 예

용기 고정 {

background-color:#000; 
filter:alpha(opacity=85); 
-moz-opacity: 0.85; 
opacity: 0.85; 
width:1000px; 
min-height:1275px; 
height:100%; 
margin:auto; 
position:relative; 
} 

{

width:100px; 
position:absolute; 
top:150px; 
left:-100px; 

}

JQuery와

$ (문서) .ready (함수() { VAR을 $ scrollingDiv = $ ("# fixed"); $ scrollingDiv .stop() .animate ({ "marginTop": ($ (윈도우) .scrollTop() + 0) + "px"} "느린"); }}); }});

Answer 2

. 어쩌면이 작동합니다 :

#container{ 
    background-color:#000; 
    filter:alpha(opacity=85); 
    -moz-opacity: 0.85; 
    opacity: 0.85; 
    width:1000px; 
    min-height:1275px; 
    height:100%; 
    margin:auto; 

    position:relative; 
} 

#fixed{ 
    position: absolute; 
    top:150px; 
} 

는 봐 : http://jsfiddle.net/gQP8X/2/주 : 더 나은 jsfiddle 적합성을 일부 변경했습니다.

Answer 3

이 시도 ,

#wrapper{ 
    width: 600px; 
    height: 2000px; 
    margin: auto; 
    position: relative; 

} 

#content{ 
    margin: auto; 
    width: inherit; 
    height: 100%; 
    float: left; 
} 

#sidebar{ 
    width: 100px; 
    height: 100%; 
    position: absolute; 
     left: -100px; 
} 

#fixed{ 
    top: 100px; 
    width: 100px; 
    height: 150px; 
    position: fixed; 
    background-color: cyan; 
} 

그리고

<div id="wrapper"> 
     <div id="content"></div> 
     <div id="sidebar"> 
      <div id="fixed">something</div> 
     </div> 
    </div>