Reduce width of scrollbar in Mozilla and IE
I want to reduce width of scrollbar in mozilla and ieI have searched for solutions online but nothing helped
webkit checks working fine in chrome but not in mozila and ie
need solution soon
regareds
Dn
You must Sign In to post a response.
Category: HTML
I have searched for solutions online but nothing helped
webkit checks working fine in chrome but not in mozila and ie
need solution soon
regareds
Dn
#759281
Hello Deepak Negi,
Refer the below code java script code:
$(function()
{
var win = $(window);
// Full body scroll
var isResizing = false;
win.bind(
'resize',
function()
{
if (!isResizing) {
isResizing = true;
var container = $('#full-page-container');
// Temporarily make the container tiny so it doesn't influence the
// calculation of the size of the document
container.css(
{
'width': 1,
'height': 1
}
);
// Now make it the size of the window...
container.css(
{
'width': win.width(),
'height': win.height()
}
);
isResizing = false;
container.jScrollPane(
{
'showArrows': true
}
);
}
}
).trigger('resize');
// Workaround for known Opera issue which breaks demo (see
// http://jscrollpane.kelvinluck.com/known_issues.html#opera-scrollbar )
$('body').css('overflow', 'hidden');
// IE calculates the width incorrectly first time round (it
// doesn't count the space used by the native scrollbar) so
// we re-trigger if necessary.
if ($('#full-page-container').width() != win.width()) {
win.trigger('resize');
}
// Internal scrollpanes
$('.scroll-pane').jScrollPane({showArrows: true});
});
CSS File :
/* Styles specific to this particular page */
html
{
overflow: auto;
}
#full-page-container
{
overflow: auto;
}
.scroll-pane
{
width: 100%;
height: 200px;
overflow: auto;
}
.horizontal-only
{
height: auto;
max-height: 200px;
}
Hope this will help you.
Mark the answer if it helped you.
Regards,
Nirav Lalan
DNS Gold Member
"If you can dream it, you can do it."
Refer the below code java script code:
$(function()
{
var win = $(window);
// Full body scroll
var isResizing = false;
win.bind(
'resize',
function()
{
if (!isResizing) {
isResizing = true;
var container = $('#full-page-container');
// Temporarily make the container tiny so it doesn't influence the
// calculation of the size of the document
container.css(
{
'width': 1,
'height': 1
}
);
// Now make it the size of the window...
container.css(
{
'width': win.width(),
'height': win.height()
}
);
isResizing = false;
container.jScrollPane(
{
'showArrows': true
}
);
}
}
).trigger('resize');
// Workaround for known Opera issue which breaks demo (see
// http://jscrollpane.kelvinluck.com/known_issues.html#opera-scrollbar )
$('body').css('overflow', 'hidden');
// IE calculates the width incorrectly first time round (it
// doesn't count the space used by the native scrollbar) so
// we re-trigger if necessary.
if ($('#full-page-container').width() != win.width()) {
win.trigger('resize');
}
// Internal scrollpanes
$('.scroll-pane').jScrollPane({showArrows: true});
});
CSS File :
/* Styles specific to this particular page */
html
{
overflow: auto;
}
#full-page-container
{
overflow: auto;
}
.scroll-pane
{
width: 100%;
height: 200px;
overflow: auto;
}
.horizontal-only
{
height: auto;
max-height: 200px;
}
Hope this will help you.
Mark the answer if it helped you.
Regards,
Nirav Lalan
DNS Gold Member
"If you can dream it, you can do it."
#763004
Switch from Aero to a basic theme. you can get the old dialog by right-clicking the desktop, choosing Personalize, then at the bottom of that pane, clicking Window Color to go directly to the dialog. With Aero themes, you get an intermediate color screen and need to click the Advanced settings link. Hope this helps.
Return to Return to Discussion Forum