가로 스크롤로 세로 스크롤

-1

가로로 세로 스크롤을 만드는이 코드를 발견했습니다. 어떻게 반대를 달성 할 수 있습니까? 미리 감사드립니다.가로 스크롤로 세로 스크롤

HTML :

<div id='first'> 
    <div id='second'> 
     <!-- content --> 
    </div>

CSS :

#first { 
    overflow:hidden; 
    height:9000px; 
} 
#second { 
width:9000px; 
position:fixed; 
    }

JS :

window.onscroll=function() { 
    var scroll = window.scrollY; 
    $('#second').css('left', '-' + scroll + 'px'); 
}

바이올린 : http://jsfiddle.net/zfBhK/

출처

2014-12-29 Billef32

코드가 업데이트되었습니다. 이제 코드 스크롤 수평 이동으로 제 2 콘텐츠가 이제 수직으로 이동해야

<html> 
<head> 
    <script src="https://code.jquery.com/jquery-1.11.2.js"></script> 
<style> 

body{ 
    overflow-x: auto; 
} 

#first { 
    /*first I set position to absolute*/ 
    position:absolute; 
} 
#second { 
    position:fixed; 
} 
</style> 

</head> 
<body> 
<div id='first' style="position:absolute"> 
    <h1>my1stContent*my1stContent*my1stContent*my1stContent*my1stContent*my1stContent*my1stContent*my1stContent*my1stContent*<h1> 
    </div> 
     <br><br><br> 
<div id='second'> 
<h1>my2ndContent*my2ndContent*my2ndContent*my2ndContent*my2ndContent*my2ndContent*my2ndContent*my2ndContent*my2ndContent*</h1> 
</div> 

<script> 

window.onscroll=function() { 
    var scroll = window.scrollX; 
    //i then modified the css by changing to 'top' 
    $('#second').css('margin-top', '-' + scroll + 'px'); 
} 

</script> 
</body> 
</html>

수직 운동으로 수평 이동을 가능하게한다. 질문이있는 경우 알려주십시오

출처

2014-12-30 02:30:20 mkCode

제대로 작동하는지 확실하지 않습니다. 시동기를 위해 분실 된 div가 있었다 (나는 그것을 추가했다) 그러나 아직도 작동하지 않는다. :/나는 그것에 종사하고있다 :) – Billef32

부호는 새롭게했다. 확인 해봐. 당신이 무슨 생각을하는지 제게 알려주세요 – mkCode

가로 스크롤로 세로 스크롤

답변

관련 문제