# Class Scrollbar

A Scrollbar used to replace browser native scrollbar on Mesh Element to navigate the content, such as Grid/Listbox/Tree.

#### Hierarchy (view full)

- Object
  - Scrollbar

#####
Index

### Constructors

constructor

### Properties

$oid
cave
currentPos?
dragging?
frozen?
hBarLimit
hLimit
hRatio
needH?
needV?
opts
scroller
uid
vBarLimit
vLimit
vRatio
widget
$oid

### Accessors

$class

### Methods

$init
$instanceof
$n
$super
$supers
afterCreated_
afterInit
destroy
get$Class
getCurrentPosition
hasHScroll
hasVScroll
isScrollIntoView
proxy
redraw
scrollTo
scrollToElement
setBarPosition
syncSize
isAssignableFrom
isInstance

## Constructors

### constructor

- new Scrollbar(cave, scroller, opts): zul.Scrollbar

- #### Parameters

  - ##### cave: undefined | HTMLElement

  - ##### scroller: undefined | HTMLElement

  - ##### opts: Partial<ScrollbarOptions>

  #### Returns zul.Scrollbar

  Overrides zk.Object.constructor

## Properties

### $oid

$oid: number = 0

The object ID. Each object has its own unique $oid. It is mainly used for debugging purpose.

Trick: you can test if a JavaScript object is a ZK object by examining this property, such as `if (o.$oid) alert('o is a ZK object');`

Notice: zk.Class extends from zk.Object (so a class also has $oid)

Inherited from zk.Object.$oid

### cave

cave: HTMLElement

### `Optional` currentPos

currentPos?: Position

### `Optional` dragging

dragging?: boolean

### `Optional` frozen

frozen?: Frozen

### hBarLimit

hBarLimit: number

### hLimit

hLimit: number

### hRatio

hRatio: number

### `Optional` needH

needH?: boolean

### `Optional` needV

needV?: boolean

### opts

opts: ScrollbarOptions

### scroller

scroller: HTMLElement

### uid

uid: string

### vBarLimit

vBarLimit: number

### vLimit

vLimit: number

### vRatio

vRatio: number

### widget

widget: Widget<HTMLElement> & {
frozen?: Frozen;
}

#### Type declaration

- ##### `Optional` frozen?: Frozen

### `Static` $oid

$oid: any

Inherited from zk.Object.$oid

## Accessors

### $class

- get $class(): typeof ZKObject

- The class that this object belongs to.

  #### Returns typeof ZKObject

  Inherited from zk.Object.$class

## Methods

### $init

- $init(props?): void

- The constructor.

  #### Parameters

  - ##### `Optional` props: Record<string, unknown> | (() => void)

  #### Returns void

  #### Default Value

      it does nothing so the subclass needs not to copy back
      (also harmless to call back).

  #### See

  afterInit

  #### Deprecated

  as of 10.0 released. Using ES6 `constructor` instead.

  Inherited from zk.Object.$init

### $instanceof

- $instanceof(...klass): boolean

- Determines if this object is an instance of the class represented by the specified Class parameter. Example:

      if (obj.$instanceof(zul.wgt.Label, zul.wgt.Image)) {
      }

  #### Parameters

  - ##### `Rest` ...klass: any[]

    the Class object to be checked. Any number of arguments can be specified.

  #### Returns boolean

  true if this object is an instance of the class

  Inherited from zk.Object.$instanceof

### $n

- $n(id): HTMLElement

- #### Parameters

  - ##### id: string

  #### Returns HTMLElement

### $super

- $super<M, F>(mtd, ...args): ReturnType<F>

- Invokes a method defined in the superclass with any number of arguments. It is like Function's call() that takes any number of arguments.

  Example: ```ts multiply: function (n) { return this.$super('multiply', n + 2); } ```

  #### Type Parameters

  - #### M extends "$init" | "$supers" | "_$ais" | "_$supers" | "_$proxies" | "_$super" | "_importantEvts" | "afterCreated_" | "afterInit" | "$class" | "get$Class" | "$oid" | "$instanceof" | "$super" | "proxy" | "opts" | "$n" | "dragging" | "destroy" | "redraw" | "widget" | "syncSize" | "frozen" | "_pos" | "_barPos" | "uid" | "_mouseUp" | "_mouseDown" | "_mousewheelY" | "_mousewheelX" | "_pressTimer" | "cave" | "scroller" | "currentPos" | "needV" | "needH" | "hLimit" | "hBarLimit" | "hRatio" | "vLimit" | "vBarLimit" | "vRatio" | "hasVScroll" | "hasHScroll" | "scrollTo" | "scrollToElement" | "isScrollIntoView" | "getCurrentPosition" | "setBarPosition" | "_checkBarRequired" | "_bindMouseEvent" | "_unbindMouseEvent" | "_fixScroll" | "_mouseEnter" | "_mouseLeave" | "_dragStart" | "_dragEnd" | "_dragMove" | "_syncPosition" | "_syncBarPosition" | "_syncEmbedBarPosition" | "_onScrollEnd"

  - #### F extends any

  #### Parameters

  - ##### mtd: M

    the method name to invoke

  - ##### `Rest` ...args: Parameters<F>

    any number of arguments

  #### Returns ReturnType<F>

  the object being returned by the method of the superclass.

  #### See

  zk.Object.$supers

  Inherited from zk.Object.$super

- $super<M, F>(klass, mtd, ...args): ReturnType<F>

- Invokes a method defined in the superclass with any number of arguments. It is like Function's call() that takes any number of arguments.

  It is similar to ZKObject.$super, but this method works even if the superclass calls back the same member method. In short, it is tedious but safer.

  Example: ```ts foo.MyClass = zk.$extends(foo.MySuper, { multiply: function (n) { return this.$super(foo.MyClass, 'multiply', n + 2); } ```

  Notice that the class specified in the first argument is not the super class having the method. Rather, it is the class that invokes this method.

  #### Type Parameters

  - #### M extends "$init" | "$supers" | "_$ais" | "_$supers" | "_$proxies" | "_$super" | "_importantEvts" | "afterCreated_" | "afterInit" | "$class" | "get$Class" | "$oid" | "$instanceof" | "$super" | "proxy" | "opts" | "$n" | "dragging" | "destroy" | "redraw" | "widget" | "syncSize" | "frozen" | "_pos" | "_barPos" | "uid" | "_mouseUp" | "_mouseDown" | "_mousewheelY" | "_mousewheelX" | "_pressTimer" | "cave" | "scroller" | "currentPos" | "needV" | "needH" | "hLimit" | "hBarLimit" | "hRatio" | "vLimit" | "vBarLimit" | "vRatio" | "hasVScroll" | "hasHScroll" | "scrollTo" | "scrollToElement" | "isScrollIntoView" | "getCurrentPosition" | "setBarPosition" | "_checkBarRequired" | "_bindMouseEvent" | "_unbindMouseEvent" | "_fixScroll" | "_mouseEnter" | "_mouseLeave" | "_dragStart" | "_dragEnd" | "_dragMove" | "_syncPosition" | "_syncBarPosition" | "_syncEmbedBarPosition" | "_onScrollEnd"

  - #### F extends any

  #### Parameters

  - ##### klass: typeof ZKObject

    the class that invokes this method.

  - ##### mtd: M

    the method name to invoke

  - ##### `Rest` ...args: Parameters<F>

    any number of arguments

  #### Returns ReturnType<F>

  the object being returned by the method of the superclass.

  #### See

  zk.Object.$supers

  #### Since

  5.0.2

  Inherited from zk.Object.$super

### $supers

- $supers<M, F>(name, args): ReturnType<F>

- Invokes a method defined in the superclass with an array of arguments. It is like Function's apply() that takes an array of arguments.

  Example: ```ts multiply: function () { return this.$supers('multiply', arguments); } ```

  #### Type Parameters

  - #### M extends "$init" | "$supers" | "_$ais" | "_$supers" | "_$proxies" | "_$super" | "_importantEvts" | "afterCreated_" | "afterInit" | "$class" | "get$Class" | "$oid" | "$instanceof" | "$super" | "proxy" | "opts" | "$n" | "dragging" | "destroy" | "redraw" | "widget" | "syncSize" | "frozen" | "_pos" | "_barPos" | "uid" | "_mouseUp" | "_mouseDown" | "_mousewheelY" | "_mousewheelX" | "_pressTimer" | "cave" | "scroller" | "currentPos" | "needV" | "needH" | "hLimit" | "hBarLimit" | "hRatio" | "vLimit" | "vBarLimit" | "vRatio" | "hasVScroll" | "hasHScroll" | "scrollTo" | "scrollToElement" | "isScrollIntoView" | "getCurrentPosition" | "setBarPosition" | "_checkBarRequired" | "_bindMouseEvent" | "_unbindMouseEvent" | "_fixScroll" | "_mouseEnter" | "_mouseLeave" | "_dragStart" | "_dragEnd" | "_dragMove" | "_syncPosition" | "_syncBarPosition" | "_syncEmbedBarPosition" | "_onScrollEnd"

  - #### F extends any

  #### Parameters

  - ##### name: M

    the method name to invoke

  - ##### args: Parameters<F>

    an array of arguments. In most case, you just pass `arguments` (the built-in variable).

  #### Returns ReturnType<F>

  the object being returned by the method of the superclass.

  #### See

  zk.Object.$super

  Inherited from zk.Object.$supers

- $supers<M, F>(klass, name, args): ReturnType<F>

- Invokes a method defined in the superclass with an array of arguments. It is like Function's apply() that takes an array of arguments.

  It is similar to zk.Object.$supers, but this method works even if the superclass calls back the same member method. In short, it is tedious but safer.

  Example: ```ts foo.MyClass = zk.$extends(foo.MySuper, { multiply: function () { return this.$supers(foo.MyClass, 'multiply', arguments); } ```

  Notice that the class specified in the first argument is not the super class having the method. Rather, it is the class that invokes this method.

  #### Type Parameters

  - #### M extends "$init" | "$supers" | "_$ais" | "_$supers" | "_$proxies" | "_$super" | "_importantEvts" | "afterCreated_" | "afterInit" | "$class" | "get$Class" | "$oid" | "$instanceof" | "$super" | "proxy" | "opts" | "$n" | "dragging" | "destroy" | "redraw" | "widget" | "syncSize" | "frozen" | "_pos" | "_barPos" | "uid" | "_mouseUp" | "_mouseDown" | "_mousewheelY" | "_mousewheelX" | "_pressTimer" | "cave" | "scroller" | "currentPos" | "needV" | "needH" | "hLimit" | "hBarLimit" | "hRatio" | "vLimit" | "vBarLimit" | "vRatio" | "hasVScroll" | "hasHScroll" | "scrollTo" | "scrollToElement" | "isScrollIntoView" | "getCurrentPosition" | "setBarPosition" | "_checkBarRequired" | "_bindMouseEvent" | "_unbindMouseEvent" | "_fixScroll" | "_mouseEnter" | "_mouseLeave" | "_dragStart" | "_dragEnd" | "_dragMove" | "_syncPosition" | "_syncBarPosition" | "_syncEmbedBarPosition" | "_onScrollEnd"

  - #### F extends any

  #### Parameters

  - ##### klass: typeof ZKObject

    the class that invokes this method.

  - ##### name: M

    the method name to invoke

  - ##### args: Parameters<F>

    an array of arguments. In most case, you just pass `arguments` (the built-in variable).

  #### Returns ReturnType<F>

  the object being returned by the method of the superclass.

  #### See

  zk.Object.$super

  #### Since

  5.0.2

  Inherited from zk.Object.$supers

### afterCreated_

- afterCreated_(props?): void

- This function is called after the object is initialized and all its member fields are ready to use.

  #### Parameters

  - ##### `Optional` props: Record<string, unknown> | (() => void)

    the properties passed by constructor.

  #### Returns void

  #### Since

  10.0.0

  Inherited from zk.Object.afterCreated_

### afterInit

- afterInit(func): void

- Specifies a function that shall be called after the object is initialized, i.e., after zk.Object.$init is called. This method can be called only during the execution of zk.Object.$init.

  It is an advance feature that is used to allow a base class to do something that needs to wait for all deriving classes have been initialized.

  Invocation Sequence:

  - The most derived class's $init (subclass)
  - The based class's $init (if the derived class's $init invokes this.$supers('$init', arguments))
  - The first function, if any, be added with afterInit, then the second (in the same order that afterInit was called)...

  #### Parameters

  - ##### func: CallableFunction

    the function to register for execution later

  #### Returns void

  #### See

  zk.Object.$init

  #### Deprecated

  as of 10.0 released. Using afterCreated_ instead.

  Inherited from zk.Object.afterInit

### destroy

- destroy(): void

- #### Returns void

### get$Class

- get$Class<T>(): T

- #### Type Parameters

  - #### T extends typeof ZKObject

  #### Returns T

  the class of the subsclass which extends from zk.Class.

  #### Since

  10.0.0

  Inherited from zk.Object.get$Class

### getCurrentPosition

- getCurrentPosition(): undefined | Position

- #### Returns undefined | Position

### hasHScroll

- hasHScroll(): boolean

- #### Returns boolean

### hasVScroll

- hasVScroll(): boolean

- #### Returns boolean

### isScrollIntoView

- isScrollIntoView(dom): boolean

- #### Parameters

  - ##### dom: HTMLElement

  #### Returns boolean

### proxy

- proxy<A, R>(func): ((...args) => R)

- Proxies a member function such that it can be called with this object in a context that this object is not available. It sounds a bit strange at beginning but useful when passing a member of an object that will be executed as a global function.

  Example: Let us say if you want a member function to be called periodically, you can do as follows. ```ts setInterval(wgt.proxy(wgt.doIt), 1000); //assume doIt is a member function of wgt ```

  With proxy, when doIt is called, this references to wgt. On the other hand, the following won't work since this doesn't reference to wgt, when doIt is called. ```ts setInterval(wgt.doIt, 1000); //WRONG! doIt will not be called with wgt ```

  Notice that this method caches the result so that it will return the same proxied function, if you pass the same function again.

  #### Type Parameters

  - #### A extends unknown[]

  - #### R

  #### Parameters

  - ##### func: ((...args) => R)

    a method member of this object

    - - (...args): R

      - #### Parameters

        - ##### `Rest` ...args: A

        #### Returns R

  #### Returns ((...args) => R)

  a function that can be called as a global function (that actually have `this` referencing to this object).

  - - (...args): R

    - #### Parameters

      - ##### `Rest` ...args: A

      #### Returns R

  Inherited from zk.Object.proxy

- proxy<A0, A, R>(func): ((arg0, ...args) => R)

- #### Type Parameters

  - #### A0

  - #### A extends unknown[]

  - #### R

  #### Parameters

  - ##### func: ((arg0, ...args) => R)

    - - (arg0, ...args): R

      - #### Parameters

        - ##### arg0: A0

        - ##### `Rest` ...args: A

        #### Returns R

  #### Returns ((arg0, ...args) => R)

  - - (arg0, ...args): R

    - #### Parameters

      - ##### arg0: A0

      - ##### `Rest` ...args: A

      #### Returns R

  Inherited from zk.Object.proxy

- proxy<A0, A1, A, R>(func): ((arg0, arg1, ...args) => R)

- #### Type Parameters

  - #### A0

  - #### A1

  - #### A extends unknown[]

  - #### R

  #### Parameters

  - ##### func: ((arg0, arg1, ...args) => R)

    - - (arg0, arg1, ...args): R

      - #### Parameters

        - ##### arg0: A0

        - ##### arg1: A1

        - ##### `Rest` ...args: A

        #### Returns R

  #### Returns ((arg0, arg1, ...args) => R)

  - - (arg0, arg1, ...args): R

    - #### Parameters

      - ##### arg0: A0

      - ##### arg1: A1

      - ##### `Rest` ...args: A

      #### Returns R

  Inherited from zk.Object.proxy

- proxy<A0, A1, A2, A, R>(func): ((arg0, arg1, arg2, ...args) => R)

- #### Type Parameters

  - #### A0

  - #### A1

  - #### A2

  - #### A extends unknown[]

  - #### R

  #### Parameters

  - ##### func: ((arg0, arg1, arg2, ...args) => R)

    - - (arg0, arg1, arg2, ...args): R

      - #### Parameters

        - ##### arg0: A0

        - ##### arg1: A1

        - ##### arg2: A2

        - ##### `Rest` ...args: A

        #### Returns R

  #### Returns ((arg0, arg1, arg2, ...args) => R)

  - - (arg0, arg1, arg2, ...args): R

    - #### Parameters

      - ##### arg0: A0

      - ##### arg1: A1

      - ##### arg2: A2

      - ##### `Rest` ...args: A

      #### Returns R

  Inherited from zk.Object.proxy

- proxy<A0, A1, A2, A3, A, R>(func): ((arg0, arg1, arg2, arg3, ...args) => R)

- #### Type Parameters

  - #### A0

  - #### A1

  - #### A2

  - #### A3

  - #### A extends unknown[]

  - #### R

  #### Parameters

  - ##### func: ((arg0, arg1, arg2, arg3, ...args) => R)

    - - (arg0, arg1, arg2, arg3, ...args): R

      - #### Parameters

        - ##### arg0: A0

        - ##### arg1: A1

        - ##### arg2: A2

        - ##### arg3: A3

        - ##### `Rest` ...args: A

        #### Returns R

  #### Returns ((arg0, arg1, arg2, arg3, ...args) => R)

  - - (arg0, arg1, arg2, arg3, ...args): R

    - #### Parameters

      - ##### arg0: A0

      - ##### arg1: A1

      - ##### arg2: A2

      - ##### arg3: A3

      - ##### `Rest` ...args: A

      #### Returns R

  Inherited from zk.Object.proxy

### redraw

- redraw(cave, orient): void

- #### Parameters

  - ##### cave: HTMLElement

  - ##### orient: string

  #### Returns void

### scrollTo

- scrollTo(x, y, time?, relative?): void

- #### Parameters

  - ##### x: number

  - ##### y: number

  - ##### `Optional` time: number

  - ##### `Optional` relative: boolean

  #### Returns void

### scrollToElement

- scrollToElement(dom): void

- #### Parameters

  - ##### dom: HTMLElement

  #### Returns void

### setBarPosition

- setBarPosition(barPosition): this

- #### Parameters

  - ##### barPosition: number

  #### Returns this

### syncSize

- syncSize(showScrollbar?): void

- #### Parameters

  - ##### `Optional` showScrollbar: boolean

  #### Returns void

### `Static` isAssignableFrom

- isAssignableFrom(cls): boolean

- Determines if the class by this Class object is either the same as, or is a superclass of, the class represented by the specified Class parameter. Example:

      if (klass1.isAssignableFrom(klass2)) {
      }

  #### Parameters

  - ##### cls: typeof ZKObject

    the Class object to be checked, such as zk.Widget.

  #### Returns boolean

  true if assignable

  Inherited from zk.Object.isAssignableFrom

### `Static` isInstance

- isInstance<T>(this, o): o is InstanceType<T>

- Determines if the specified Object is assignment-compatible with this Class. This method is equivalent to [[zk.Object#$instanceof]. Example:

      if (klass.isInstance(obj)) {
      }

  #### Type Parameters

  - #### T extends typeof ZKObject

  #### Parameters

  - ##### this: T

  - ##### o: unknown

    the object to check

  #### Returns o is InstanceType<T>

  true if the object is an instance

  Inherited from zk.Object.isInstance