Javascript 如何将滚动条的位置从元素的底部更改为顶部？_Javascript_Html_Css

Javascript 如何将滚动条的位置从元素的底部更改为顶部？

javascript html css

Javascript 如何将滚动条的位置从元素的底部更改为顶部？,javascript,html,css,Javascript,Html,Css,是否可以使用css将滚动条的位置从元素的底部更改为顶部我怎么能做到 codepen.io/anon/pen/xacvC 我想在元素的顶部有滚动条。好的，我想到了这个。根据您的需要修改它，但这就是您所需要的，您只需要CSS，不需要JS。这不会更改滚动条，而是将其翻转到顶部，而不是底部。如果你想改变滚动条，那么你需要一个插件（JS插件） .集装箱 { 宽度：200px；溢出y：自动； } .Content{宽度：300px；} .Container、.Content { 变换：rotateX（

是否可以使用css将滚动条的位置从元素的底部更改为顶部

我怎么能做到

codepen.io/anon/pen/xacvC

我想在元素的顶部有滚动条。

好的，我想到了这个。根据您的需要修改它，但这就是您所需要的，您只需要CSS，不需要JS。这不会更改滚动条，而是将其翻转到顶部，而不是底部。如果你想改变滚动条，那么你需要一个插件（JS插件）


.集装箱
{
宽度：200px；
溢出y：自动；
}
.Content{宽度：300px；}
.Container、.Content
{
变换：rotateX（180度）；
-moz变换：rotateX（180度）；/*Mozilla*/
-webkit变换：rotateX（180度）；/*Safari和Chrome*/
-ms变换：rotateX（180度）；/*IE 9+*/
-o型变换：旋转（180度）；/*Opera*/
}
内容内容内容内容内容

没有css方法来设置浏览器默认滚动条的样式。您必须添加一个自定义滚动条，将其放置在元素的顶部，然后添加适当的javascript处理程序以获得滚动效果，例如设置左/右位置动画，或使用css转换。在我看来，第二种方法会更好、更容易使用。我如何跨浏览器、更容易地使用它？有一种方法。我只是想用一种简单的方法把它做好。@FrederikMoller如果你能让它工作的话，请把它贴出来——我很好奇。不过-它必须是一个跨浏览器兼容的解决方案，而不是一个工作草案。。。用户3775292请使用您的评论中的问题编辑您的问题-如何制作自定义的跨浏览器滚动条（例如@wick3d）-请注意，他不想更改滚动条，他希望滚动条位于内容的顶部，而不是底部。这很聪明！如果你在其中加入一些动态内容，会不会没有坏处？谢谢，但我应该支持IE8。因此，我不能使用此解决方案。但是我认为这是未来最好的解决方案。@wick3d-不，我刚刚测试过，我在jQuery中的点击事件上添加了一个按钮，这个按钮是直立的。即使是对内容页面的Ajax调用也是垂直的。唯一的问题是。。。我们都知道。。即。。。等等，这是我们的问题。你需要一个火箭科学学位才能让它工作LOL。这会导致垂直滚动方向反转。这不是一个合适的解决方案。嵌套内容不会旋转，这会将其倒置显示。

<html>
    <head>
        <title></title>
        <style>
            .Container
            {
                width: 200px;
                overflow-y: auto;
            }

            .Content { width: 300px; }

            .Container, .Content
            {
                transform:rotateX(180deg);
                -moz-transform:rotateX(180deg); /* Mozilla */
                -webkit-transform:rotateX(180deg); /* Safari and Chrome */
                -ms-transform:rotateX(180deg); /* IE 9+ */
                -o-transform:rotateX(180deg); /* Opera */
            }
        </style>
    </head>
    <body>
        <div class="Container">
            <div class="Content">
                Content Content Content Content Content Content Content Content Content Content Content Content Content Content 
            </div>
        </div>
    </body>
</html>