1
여러 개의 이미지 행 (가로 스크롤이있는 이미지)이있는 간단한 페이지를 만들려고합니다 (Nicescroll 3 사용).Nicescroll 3 - 가로 스크롤이 끝난 후 세로 스크롤이 끝납니다.
마우스를 사용하면 행의 가로 스크롤이 끝나면 마우스 휠이 작동하지 않습니다. 내가 원했던 것은 수평 스크롤이 끝난 후에 페이지가 수직 스크롤링을 계속했다는 것입니다.
내 코드 :
HTML :
<div id="main-content">
<div class="row">
<div class="square-container">
<div class="square"></div>
</div>
<!-- several other square-container divs -->
<div class="square-container">
<div class="square"></div>
</div>
</div>
<div class="row">
<!-- several other square-container divs -->
</div>
<!-- several other rows -->
</div>
</div>
CSS :
#main-content{
min-height: 100%;
height: auto;
}
#main-content > .row {
overflow-x:scroll;
overflow-y:hidden;
white-space:nowrap;
}
.square-container {
float:none;
display:inline-block;
margin: 20px 30px 5px 30px;
}
.square{
height: 100px;
width: 100px;
border: 1px solid black;
}
가 여기에 의견을 내 Fiddle