2014-07-17 1 views
1

나는 오버플로가있는 div 안에 넣어서 가로 스크롤이 가능하도록 많은 열이있는이 테이블을 가지고 있습니다. 스크롤바는 div의 하단에 위치합니다. 내 질문은 : 당신이 2 scrollbars, div 아래쪽 및 div 위쪽에있는 다른 하나 가질 수 있습니까? 그렇다면 어떻게 할 수 있습니까?div의 평행 한 양쪽에 스크롤 막대가 있습니까?

+4

당신의 대답은 여기에서 찾을 수 있습니다 http://stackoverflow.com/questions/3934271/horizontal-scrollbar-on 테이블 아래쪽 – arielmolina

답변

1

당신의 대답은 여기에서 찾을 수 있습니다 : horizontal scrollbar on top and bottom of table

여기 당신이 필요로하는 바이올린의 : http://jsfiddle.net/TBnqw/1/

그리고 여기에 코드입니다 :

HTML :

<div class="wrapper1"> 
     <div class="div1"></div> 
    </div> 
    <div class="wrapper2"> 
     <div class="div2"> 
     <!-- Content Here --> 
     </div> 
    </div> 

CSS :

.wrapper1, .wrapper2 { 
     width: 300px; 
     overflow-x: scroll; 
     overflow-y:hidden; 
    } 

    .wrapper1 {height: 20px; } 
    .wrapper2 {height: 200px; } 

    .div1 { 
     width:1000px; 
     height: 20px; 
    } 

    .div2 { 
     width:1000px; 
     height: 200px; 
     background-color: #88FF88; 
     overflow: auto; 
    } 

JS :

$(function(){ 
     $(".wrapper1").scroll(function(){ 
     $(".wrapper2").scrollLeft($(".wrapper1").scrollLeft()); 
     }); 
     $(".wrapper2").scroll(function(){ 
     $(".wrapper1").scrollLeft($(".wrapper2").scrollLeft()); 
     }); 
    }); 
+0

감사합니다! 정말 도움이 –

+0

환영합니다! :) – arielmolina

+0

하지만, 고정 너비를 설정하면 스크롤 할 수 있습니다 .... 아무런 필요가 없을지라도 :( –

관련 문제