如何用CSS改变滚动条的位置？
如何用CSS改变滚动条的位置？
提问于 2013-09-25 14:27:42
有没有办法用CSS从左到右或从下到上改变滚动条的位置？
回答 2
Stack Overflow用户
发布于 2016-03-04 11:51:12
这是另一种方法，通过rotating element使用180deg,的scrollbar将其content包装到另一个元素中，并使用rotating将wrapper用于-180deg。检查下面的代码片段
div {
display: inline-block;
width: 100px;
height: 100px;
border: 2px solid black;
margin: 15px;
}
#vertical {
direction: rtl;
overflow-y: scroll;
overflow-x: hidden;
background: gold;
}
#vertical p {
direction: ltr;
margin-bottom: 0;
}
#horizontal {
direction: rtl;
transform: rotate(180deg);
overflow-y: hidden;
overflow-x: scroll;
background: tomato;
padding-top: 30px;
}
#horizontal span {
direction: ltr;
display: inline-block;
transform: rotate(-180deg);
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id=vertical>
<p>content
<br>content
<br>content
<br>content
<br>content
<br>content
<br>content
<br>content
<br>content
<br>content
<br>content
<br>content
<br>content</p>
</div>
<div id=horizontal><span> content_content_content_content_content_content_content_content_content_content_content_content_content_content</span>
</div>
Stack Overflow用户
发布于 2013-09-25 14:50:51
试试这个。希望这能有所帮助
<div id="single" dir="rtl">
<div class="common">Single</div>
</div>
<div id="both" dir="ltr">
<div class="common">Both</div>
</div>
#single, #both{
width: 100px;
height: 100px;
overflow: auto;
margin: 0 auto;
border: 1px solid gray;
}
.common{
height: 150px;
width: 150px;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/18997724
复制相关文章
相似问题