【问题标题】:How to make the scrollbar of a Jquery-Confirm wider?如何使 Jquery-Confirm 的滚动条更宽?
【发布时间】:2019-03-05 22:40:27
【问题描述】:

我正在尝试使滚动条更宽,因为当有很多内容要向下滚动时,默认滚动条确实不方便单击和移动得更快。考虑你实例化一个确认:

var self = this;

$.confirm({
    title: "This is the title",
    columnClass: 'col-md-12',
    useBootstrap: true,
    backgroundDismiss: false,
    content: getHtml(),
    defaultButtons: false
});

然后你在上面加载大量内容:

getHtml = function()
{    
    html = "";

    for (var i = 3000 - 1; i >= 0; i--)
    {
        html += "<span>demo</span><br>"
    }

    return html
}

通过使用Google Chrome,滚动条看起来会很细,当你用鼠标指向滚动条来拖动它时,你需要非常精确。对某些人来说,这很难做到。

我尝试通过更改溢出 CSS 属性,但这只会使栏可见或不可见。关于如何强制它变宽的任何想法?

A fiddle to play with.

提前致谢,

【问题讨论】:

    标签: javascript jquery css jquery-confirm


    【解决方案1】:

    Jquery Confirm 样式表中的具体类是:

    .jconfirm .jconfirm-box div.jconfirm-content-pane::-webkit-scrollbar {
      width: 3px;
    }
    

    将其设置为您喜欢的自定义样式以覆盖。

    【讨论】:

    • 谢谢你,丹尼尔!
    【解决方案2】:

    对于 Chrome,您可以在带有内容的元素上使用这种 css 样式

    selector_of_the_element::-webkit-scrollbar {
      width: 30px;
    }
    

    【讨论】:

    • 谢谢你,安杰!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-01-13
    • 2011-06-03
    • 2011-02-03
    相关资源
    最近更新 更多