內層盒子滾動條滑動到底部會滑動外層滾動條解決方法


我也查了很多資料,沒有采取禁止滾動條的方式。

因為內層盒子滑到最底部就會開始滑動外層盒子的滾動條

解決方案  不然內層滾動條滾動到最底部

測試  兼容ie8+ 谷歌OK(其它瀏覽器沒有測試)

<style type="text/css">
.main{
overflow: auto;
width: 400px;
height: 400px;
border: 1px solid #aaa;
}
.main p{
height: 15px;
}
</style>
<script src="jquery.min.js"></script>
<body>
<div id="main" class="main">
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
<p>sdfsfsdfs</p>
</div>
<p style="height:1000px;"></p>
</body>
<script type="text/javascript">
$(function () {
$('#main').hover(function(){
var height = document.getElementById('main').scrollHeight;    //滾動內容的高度
var boxHeight = $('#main').height();   //滾動盒子的高度
$('#main').scroll(function(){
var _top = $('#main').scrollTop();   //滑動距離top的高度
if(_top === (height - boxHeight)){   //理想情況下 滑動到最底部是等於scrollHeight-boxHeight的  
$('#main').scrollTop(_top-1);   //改變scrollTop值 永遠滑不到最底部
}
})
},function(){
$('#main').off('scroll');
});
});

</script>
 
親測兼容ie8  
由於我查了很多資料都沒有找到解決方案 所以決定寫下了


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM