A javascript scrollbar plugin that hides the native scrollbars, provides custom styleable overlay scrollbars, and preserves the native functionality and feel.
MIT License
Bot releases are visible (Hide)
Published by KingSora about 5 years ago
Bugfixes:
Improvements:
build.js
file)react
, vue
and angular
components are finally out, you can install them via npm
or you can find them in the packages
folder:npm install overlayscrollbars-react
npm install overlayscrollbars-vue
npm install overlayscrollbars-ngx
Published by KingSora about 5 years ago
Bugfixes:
min-width
change wasn't detected if width is auto
update
function didn't update a textarea
properly, when only its value
changed and due to that its size.Features:
OverlayScrollbars.valid
which checks whether a passed object is a non-destroyed OverlayScrollbars instance. You can read more about it here.Improvements:
Published by KingSora over 5 years ago
Bugfixes:
autoUpdate : true
set.update()
method didn't undo the sleep()
method like it should.Features:
getState()
methods returned object contains now a new property called destroyed
which indicates that the instance has been destroyed.Improvements:
passive event listeners
: touch events which call prefentDefault()
are now added with passive : false
, all other events which should be passive and don't call prefentDefault()
are added with passive : true
. Fixed #124 with this change.framework wrappers
such as react
, vue
and angular
: the option()
method will now only cause a call to the update()
method if at least one option has been truly changed.Internal Changes:
update()
method.tests
.Published by KingSora over 5 years ago
Bugfixes:
scroll
or update
function.MutationObserver
listens now to the open
attribute.host element
when its size was 0
previously.IE8
bug where the plugin didn't work correctly.Published by KingSora over 5 years ago
Bugfixes:
width: auto
elements had incorrect width if paddingAbsolute
was true
.Improvements:
textarea
size measuring process, which results also in better performance if plugin is initialized on textarea
elements.Published by KingSora over 5 years ago
Published by KingSora over 5 years ago
Bugfixes:
eval()
call in the scroll
method is now only needed if you pass a calculation or a unit string. Coordinates like 500
, "500px"
, "+=500"
, "+=500px"
are now executed without eval()
.px
like "50%"
, "1vw"
, 1vh
or whole calculation strings like "100px - 5%"
, "50% - 10px + 1vh"
still needs the eval()
.textarea
-size was calculated incorrectly when padding
was 0
.overflow-amount
to be incorrect on auto-sized elements.Features:
scrollbars.snapHandle
was added which helps you to control how the scrollbar-handle behaves if you use CSS Snap Scrolling
. Read more about it in the documentation
scroll()
methods returned object now has a new property called snappedHandleOffset
. This is a object which represents the current handle-offset as if it was snapped with CSS Snap Scrolling
, the normal handleOffset
represents the current non snapped handle-offset. You can read more in the documentation which is up to date.Improvements:
CSS Snap Scrolling
has now deeper support: The handle dragging is now smooth (controlled with the new option scrollbars.snapHandle
) and the jump-back if you let go midway has now a transition.handle
-max-size and the overflow is way to small, the resulting jump-back if you let go midway has now a transition.handle
the next calculated scroll-position is now rounded
instead of floored
which results in better user-experience.Click scrolling
is now more precise.Changes:
v1.6.0
deprecated object which the .scroll()
-method returns is now removed. You can read more details in the documentation. I've removed it to reduce the code size.Internal Changes:
Published by KingSora over 5 years ago
Bugfixes:
scroll
method sometimes scrolled to the wrong offset if the host size changed shortly beforescrollbars.clickScrolling
, scrollbars.dragScrolling
or scrollbars.autoHide
optiongrid-layout
Published by KingSora almost 6 years ago
Bugfixes:
img
element, was recognized but the DOM didn't update accordingly.Improvements:
textarea
functionality compatible with frameworks where you are forced to use a wrapper around your web-component
. (such as Angular or Aurelia)Published by KingSora almost 6 years ago
Bugfixes:
textareas
with content-box
box-sizingcontent-box
sizing affected float
detection (sometimes)Improvements:
auto
Please make sure you use the latest CSS file, else this update could cause some troubles.
Published by KingSora almost 6 years ago
Bugfixes:
complete
callback of the scroll function was fired but the scroll-information from the scroll
-method wasn't correct if you used them in the callbackFeatures:
textarea.inheritedAttrs
which was created to increase the control over the styling of textarea instances. Read more about it in the documentation..scroll()
-method you can now pass a object
as easing value which sepecifies a special easing.{ x : 'linear', y : 'easeOutBounce' }
flexbox
compatibility (with the os-host-flexbox
className)onOverflowChanged
, onOverflowAmountChanged
, onDirectionChanged
, onContentSizeChanged
, onHostSizeChanged
and onUpdated
are now dispatched after the onInitialized
callback to provide the initial status. (so you don't have to handle the initial status separately in the onInitialized
callback anymore)Changes:
.scroll()
-method returns has changed. I believe the new structure is much more practical. The old behavior is now deprecated. You can read more details in the documentation.Internal Changes:
Published by KingSora almost 6 years ago
General:
Bugfixes:
0.231
px for example) more accurate. (for example if element is transformed / zoomed, or the browser zoom isn't exactly 100%)hover
method from the jQuery version, because it will be deprecated in the future. (#66)Extensions:
type
method from the framework
object into the compatibility
object, because jQuery will deprecated it in the future.isArray
method from the framework
object into the compatibility
object, because jQuery will deprecated it in the future. The method has also a new name: isA
..hover(inHandler, outHandler)
method from the framework
object, because jQuery will deprecated it in the future. Please use the methods .on('mouseenter', inHandler)
and .on('mouseleave', outHandler)
instead.The documentation is up to date: https://kingsora.github.io/OverlayScrollbars/#!documentation/extensions-basics
Published by KingSora about 6 years ago
Published by KingSora over 6 years ago
JS
.scroll()
method if the direction of the target element was rtl
General
Published by KingSora over 6 years ago
opacity
anymore to make the handle color transparent, it uses now background: rgba()
to achieve the same effect.element options
was changed. The axis
property is now deprecated and its replacement is the new scroll
property. This was done in order to provide the same functionality as the Element.scrollIntoViewIfNeeded() and the Element.scrollIntoView() method.Published by KingSora over 6 years ago
getState()
method called documentMixed
. It indicates whether the host-elements document isn't the same document as the one with which the plugin was initialized. If this property is true it's most likely the host-element is inside a iFrame.Published by KingSora over 6 years ago
Fixed #28
Published by KingSora over 6 years ago
Fixed #25
Fixed a bug where the offset of the vertical scrollbar handle wasn't calculated properly.
Published by KingSora over 6 years ago
I've rewritten the whole option handling. It's not possible to set invalid default options anymore.
The size of the plugin was reduced about 3-4kb in the minified versions.