div 내부의 스크롤바를 하단, 상단으로 스크롤하는 기능 구현
- 小云云원래의
- 2017-12-21 09:31:563958검색
div 내부의 스크롤 막대를 아래쪽 및 위쪽으로 스크롤하는 기능 구현과 관련하여 이번 기사에서는 p 내부의 스크롤 막대를 아래쪽 및 위쪽으로 스크롤하도록 구현하는 코드를 공유하겠습니다. 좋은 참조 가치가 있습니다. 모두에게 도움이 되기를 바랍니다.
예제는 다음과 같습니다.
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.scrollp{
width: 500px;
height: 400px;
margin: 10px auto;
background: #f00;
overflow-y: scroll;
padding: 10px;
}
</style>
</head>
<body>
<p class="scrollp" id="testp">
<br><br><br><br><br><br><br><br><br><br><br>
<script type="text/javascript">
var pscroll=document.getElementById('testp');
function pScroll(){
var scrollTop=pscroll.scrollTop;//页面上卷的高度
var wholeHeight=pscroll.scrollHeight;//页面底部到顶部的距离
var pHeight=pscroll.clientHeight;//页面可视区域的高度
if(scrollTop+pHeight>=wholeHeight){
alert('我到底部了');
}
if(scrollTop==0){
alert('我到顶部了')；
}
}
pscroll.onscroll=pScroll;
</script>
</body>
</html>다들 배워보셨나요? 아이디어는 똑같으니, 서둘러서 시도해 보세요.
관련 권장 사항:
스크롤 막대 위치 판단_javascript 기술을 기반으로 한 간단한 예
위 내용은 div 내부의 스크롤바를 하단, 상단으로 스크롤하는 기능 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.