Skip to content

Zoom in Chrome. #150

@FantomNY

Description

@FantomNY

When you make a change zoom in the browser, like Chrome (middle wheel), you can see a custom scroll bar. It is a bag.
I found to fix it.

In file getScrollbarWidth.js
`'use strict';

Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = getScrollbarWidth;

var _domCss = require('dom-css');

var _domCss2 = _interopRequireDefault(_domCss);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

var scrollbarWidth = false;
var zoomBrowser = 100;

function getScrollbarWidth(zoom) {
if (scrollbarWidth !== false && zoomBrowser === zoom) return scrollbarWidth;
/* istanbul ignore else */
if (typeof document !== 'undefined') {
var div = document.createElement('div');
(0, _domCss2["default"])(div, {
width: 100,
height: 100,
position: 'absolute',
top: -9999,
overflow: 'scroll',
MsOverflowStyle: 'scrollbar'
});
document.body.appendChild(div);
scrollbarWidth = div.offsetWidth - div.clientWidth + 1;
document.body.removeChild(div);
} else {
scrollbarWidth = 0;
}
zoomBrowser = zoom;
return scrollbarWidth || 0;
}`


And file Scrollbars\index.js
`{
key: 'render',
value: function render() {
var _this7 = this;
var browserZoomLevel = Math.round(window.devicePixelRatio * 100);
var scrollbarWidth = (0, _getScrollbarWidth2["default"])(browserZoomLevel);
/* eslint-disable no-unused-vars */

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions