2012-12-19 2 views
10

컨테이너 안에 div가 있고 화면 오른쪽에 고정하고 싶습니다. 그러나 사용자가 스크롤을 시작하면 왼쪽으로 끝까지 이동합니다. 어떤 도움을 주셔서 감사합니다.부트 스트랩 접미사가 스크롤 할 때 왼쪽으로 끝까지 움직입니다.

http://jsfiddle.net/kbLak/

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap.min.css" rel="stylesheet"> 

최근 일 :

 </div> 
    </div> 
</div> 
<div class="explore_recentAlbums" data-spy="affix" data-offset-top="20"> 
    <div class="ex_recentBar"> 
     <div class="ex_titleDetails"> 
      <span>recent stuff: </span> 
     </div> 
    </div> 
    <table> 
     <tr> 
      <td> 

        <div class="well well-small" style="margin-bottom: 1px;"> 
         <span>Recent</span> 
        </div> 

        <span class="NoDataFound">No Photo.</span> 


        <div class="smallalbumcover"> 
         <div class="mosaic-blocksmall mofade"> 
          <div class="mosaic-overlay"> 
           <div class="details"> 
            <p> 
             <a href="#">xzxz</a> 
            </p> 
           </div> 
          </div> 
          <div class="mosaic-backdrop"> 
           <img src=""/> 
          </div> 
         </div> 
         <div class="clearfix"> 
         </div> 
        </div> 

        <div style="margin-bottom: 1em; text-align: center; margin-top: 10px;"> 
         <a style="text-decoration: none;" href="/pics"><span class="label label-info">View More</span></a> 
        </div> 

      </td> 
     </tr> 
     <tr> 
      <td> 

        <div class="well well-small" style="margin-bottom: 1px;"> 
         <span>Recent Video Albums</span> 
        </div> 

        <span class="NoDataFound">No Video.</span> 

        <div class="smallalbumcover"> 
         <div class="mosaic-blocksmall mofade"> 
          <div class="mosaic-overlay"> 
           <div class="details"> 
            <p> 
             <a href="/">test</a> 
            </p> 
           </div> 
          </div> 
          <div class="mosaic-backdrop"> 
           <img src="#"/> 
          </div> 
         </div> 
         <div class="clearfix"> 
         </div> 
        </div> 

        <div style="margin-bottom: 1em; text-align: center; margin-top: 10px;"> 
         <a style="text-decoration: none;" href="/vids"><span class="label label-info">View More</span></a> 
        </div> 

      </td> 
     </tr> 
     <tr> 
      <td> 

        <div class="well well-small" style="margin-bottom: 1px;"> 
         <span>Recent P</span> 
        </div> 

        <span class="NoDataFound">No.</span> 

        <div class="smallalbumcover"> 
         <div class="mosaic-blocksmall mofade"> 
          <div class="mosaic-overlay"> 
           <div class="details"> 
            <p> 
             <a href="/">test</a> 
            </p> 
           </div> 
          </div> 
          <div class="mosaic-backdrop"> 
           <img src=""/> 
          </div> 
         </div> 
         <div class="clearfix"> 
         </div> 
        </div> 

        <div style="margin-bottom: 1em; text-align: center; margin-top: 10px;"> 
         <a style="text-decoration: none;" href="/aio"><span class="label label-info">View More</span></a> 
        </div> 


      </td> 
     </tr> 
    </table> 
</div> 

+0

사용자가 스크롤하거나 고정 할 때 "계속 움직이지 않기"로 유지하려는 경우 – cheesemacfly

+0

예, 스크롤 할 때 오른쪽으로 고정하십시오. jsfiddle 예제를 보시기 바랍니다 – user516883

답변

15

당신의 CSS에 이것을 추가하고 오른쪽으로 남아있을 것입니다 :

.explore_recentAlbums { 
    right: 0;  
} 
+0

감사드립니다. – user516883

+0

감사합니다. 그게 효과가 있었어. 그래서 부트 스트랩이 div에 접미어 클래스를 적용 할 때 왼쪽 0을 가졌다 고 가정하기 때문에 그것이 화면의 왼쪽으로 끝까지 가게됩니다. – user516883

+0

또한 스크롤 할 때 여전히 오른쪽으로 이동합니다. 어떻게 그 위치에 유지. – user516883

관련 문제