Javascript 使用相同css的两个滚动条

Javascript 使用相同css的两个滚动条,javascript,jquery,html,css,scrollbar,Javascript,Jquery,Html,Css,Scrollbar,我正在使用,添加一个滚动条是非常容易的,但如果我想添加第二个滚动条,他们会两次使用一个mCustomScrollbar.css,我不知道如何更改第二个div。我在上查看代码,但这只是失败 JQUERY (function($){ $(window).load(function(){ $(".suwak").mCustomScrollbar(); }); })(jQuery); HTML <link href="scrollbar/jquery.mCusto

我正在使用,添加一个滚动条是非常容易的,但如果我想添加第二个滚动条,他们会两次使用一个mCustomScrollbar.css,我不知道如何更改第二个div。我在上查看代码,但这只是失败

JQUERY

(function($){
    $(window).load(function(){
        $(".suwak").mCustomScrollbar();
    });
})(jQuery);
HTML

<link href="scrollbar/jquery.mCustomScrollbar.css" rel="stylesheet" type="text/css" />
<script src="scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>

<div class="suwak"> content with first scrollbar </div>
<div class="suwak2"> content with second scrollbar </div>

你为什么不用二等舱呢?你不知道有多少个div会有相同的滚动条吗

如果仅限于2,请尝试

(function($){
$(window).load(function(){
    $(".suwak").mCustomScrollbar();
    $(".suwak2").mCustomScrollbar();
});
})(jQuery);

或者你也可以在第二节提到同样的课。根据我对您发布的代码的观察,我建议这样做。

只需在div上添加另一个class class=“suwak”,它将运行您的滚动条,您的第二个类将帮助覆盖第一个类。在css中,您是说,如果某个对象同时具有两个类,则使用新样式。在css中,选择器应该是.suwak.suwak2,css中的类之间没有空格

<div class="suwak"> content with first scrollbar </div>
<div class="suwak suwak2"> content with second scrollbar </div>

.suwak{
position:relative;
width:475px;
height:300px;
background-color: #000e1b;
color: white;
overflow:hidden
margin-top:160px;
margin-left: 15px;
}

.suwak.suwak2 {
/*new stile*/
}
带有第一个滚动条的内容
第二个滚动条内容
苏瓦克先生{
位置:相对位置;
宽度:475px;
高度:300px;
背景色:#000e1b;
颜色:白色;
溢出:隐藏
边缘顶部:160px;
左边距:15px;
}
.suwak.suwak2{
/*新栅栏*/
}

但这并不能解决我的问题,我可以在不同的div中加载两个滚动条,但我无法更改这些css。我需要从mCustomScrollBar.css中获取一些属性,并通过同时更改这些属性来扩展它?这意味着您不希望第二个div使用相同的css?嗯,meaby,我不知道。。第二个scrolbbar如何知道他必须使用第二个css?您需要在每个样式规则的开头提到所有具有第二个类名的类。由于这是由插件驱动的,所以我看不到任何其他方法。您必须将其维护为
.suwak2.yourcollBarStyleRule
等等。
<div class="suwak"> content with first scrollbar </div>
<div class="suwak suwak2"> content with second scrollbar </div>

.suwak{
position:relative;
width:475px;
height:300px;
background-color: #000e1b;
color: white;
overflow:hidden
margin-top:160px;
margin-left: 15px;
}

.suwak.suwak2 {
/*new stile*/
}