【滚动条】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