【滚动条】jquery.mCustomScrollbar在IE的兼容模式下问题

Thanks Malihu for this great plugin! Just one problem is the scrollbar does not display correct on IE7. I could fix this issue, so just post it here in case it helpful for other people.
1. Open jquery.mCustomScrollbar.css
2. Update the code as below:
a) Line 32,
Find
.mCSB_scrollTools .mCSB_draggerRail{
width:2px;
height:100%;
margin:0 auto;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}

Replace with
.mCSB_scrollTools .mCSB_draggerRail{
width:2px;
height:100%;
margin:0 0 0 -1px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
left: 50%;
position: absolute;
}

b) Line 63,
Find
.mCSB_scrollTools .mCSB_buttonDown{
top:100%;
margin-top:-40px;
}

Replace with
.mCSB_scrollTools .mCSB_buttonDown{
bottom: 0;
left: 0;
margin: 0;
position: absolute;
width: 100%;
}

Hope it help for you for still support IE7.

Reply

• Abby
  Posted on January 3, 2014 at 22:31 Permalink

  Thank you so much. I just added a ie7.css stylesheet and, using your code, made it work for IE7. I just needed to add top:auto;

  Here is what is in my ie7.css:
  .mCSB_scrollTools .mCSB_draggerRail{width:2px;height:100%;margin:0 0 0 -1px;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;left: 50%;position: absolute;}.mCSB_scrollTools .mCSB_buttonDown{top: auto;bottom: 0;left: 0;margin: 0;position: absolute;width: 100%;}

  Reply