Question

我只是在玩一些css并创建了一个滚动的元素，并显示为一个＆＃34;舷窗＆＃34;有点看法。但是，滚动条覆盖了一些元素。

我尝试了填充，边距并将其包装在另一个div中，但无法获得我希望的结果。我也尝试将相同的border-radius和dimension应用于包装div并对其应用填充，但随后内容超出了内部div。

当前的css：

div.two {
    margin:20px;
    width:300px;
    height:300px;
    border-radius:150px;
    overflow-y:scroll;
    background:url('https://s3.amazonaws.com/giphymedia/media/v0YiARQxj1yc8/giphy.gif') top center no-repeat;
    box-shadow:inset 0 0 20px rgba(0,0,0,1), 0 0 20px rgba(0,0,0,.6);
    float:right;
    -webkit-shape-outside:circle(150px at 50% 50%) border-box;
    shape-outside:circle(150px at 50% 50%) border-box;
    -webkit-shape-margin:20px;
    shape-margin:20px;
    }

那么有没有办法将其从可滚动的内容中推开？

我想我要做的是让滚动条显示在元素之外而不是内部。

更新应用答案后：http://jsfiddle.net/c78e3/5/

Answer 1

您可以在jsFiddle上尝试jQuery Scrollbar - Example。查看高级演示，了解外部滚动条的工作原理以及如何在您的情况下使用它。

jQuery(function($){
    $('div.two').scrollbar();
});

css - 位置滚动条为包含元素提供空间（外部，不在内部）

1 个答案: