div中打开滚动条与设置滚动条位置
一、给div设置滚动条二、设置滚动条的位置通过锚点跳转设置scrollTop的值当我们给div设置固定的高度或宽度的时候,超出的内容默认是不显示的.但是我们有将他们显示出来的需求,比如自己做一个,这时候我们就需要给div加上滚动条了
一、给div设置滚动条
我们只需要这么一行css代码
overflow: scroll;
如果我们只想添加高度滚动条,我们可以使用下面的语句
/*设置纵向滚动栏*/overflow-x: scroll;/*设置横向滚动栏*/overflow-y: scroll;
当然,我们可以给值设置成auto,让其在超出的时候才显示滚动条,这才是我们常用的效果吧
<!-- 当纵向元素超过div的大小时显示滚动条 --><div style="height:400px;overflow-x: auto">.........</div>
二、设置滚动条的位置
通过锚点跳转
给内部的元素设置id属性,然后通过 #id 来跳转到对应位置实现滚动条滚动location = "#id";//跳转到id对应的位置<a href="#id">滚动</a>
设置scrollTop的值
跳转到对应位置//滚动条滚到100的位置document.getElementById("div").scrollTop = 100;//滚动条直接滚动到底部let div = document.getElementById("div");div.scrollTop = div.scrollHeight;**注意**: 如果使用jQuery获取元素需要转为js对象 如 $("#div")[0].scrollTop = 100;
