# j-Scrollbar

> Benutzerdefinierte Bildlaufleisten. WICHTIG: Der aktuelle Inhalt wird umbrochen, indem zwei verschachtelte div-Elemente mit relativer Position hinzugefügt werden. Es funktioniert nur mit jComponent v17.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: de
Content-SHA256: 790831eb64681ec9112c99a03756bf74ec9a3545e0ab8aee72dad91bb95ee6f6
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Benutzerdefinierte Bildlaufleisten. __WICHTIG:__ Der aktuelle Inhalt wird umschlossen, indem zwei verschachtelte `div`-Elemente mit der Position `relative` hinzugefügt werden. __Es funktioniert nur mit jComponent v17__.

__Konfiguration__:

- `parent` {String}-Selektor für ein übergeordnetes Element, kann `window` enthalten (Standard: `undefined`)
- `visibleX` {Boolean} zeigt immer eine horizontale Bildlaufleiste an (Standard: `false`)
- `visibleY` {Boolean} zeigt immer eine vertikale Bildlaufleiste an (Standard: `false`)
- `offset` {Boolean} fügt `offset.top` dieses Elements hinzu (Standard: `false`)
- `reset` {Boolean} setzt die Position zurück, wenn `path` geändert wird (Standard: `true`)
- `margin` {Number} ein Rand für alle Arten von Anzeigen (Standard: `0`)
- `marginxs` {Nummer} ein Rand für `XS`-Anzeigen (Standard: `0`)
- `marginsm` {Nummer} ein Rand für `SM`-Anzeigen (Standard: `0`)
- `marginmd` {Nummer} ein Rand für `MD`-Anzeigen (Standard: `0`)
- `marginlg` {Number} ein Rand für `LG`-Anzeigen (Standard: `0`)
- `track` {String} kann nur definierte Pfade verfolgen, z. B. `FIELD1,FIELD2,FIELD3`, Pfade werden mit `component.path` verknüpft

__Methoden__:

- `component.reset()` setzt die Position auf `0,0` zurück
- `component.scrollleft(val)` scrollt X
- `component.scrolltop(val)` scrollt Y
- `component.scrollright(val)` scrollt X von rechts
- `component.scrollbottom(val)` scrollt Y von unten
- `component.scroll(x, y)` scrollt X,Y
- `component.resize()` ändert die Größe des Containers (er reagiert automatisch auf `resize`-Ereignisse)

Verwenden Sie es mit `<ui-component name="scrollbar">`. Wenn die Komponente noch nicht geladen ist, lädt jComponent sie bei der ersten Verwendung von der Adresse in `DEF.fallback` herunter (standardmäßig das CDN Componentator). Autor: Peter Širka. Quelle: Componentator-Komponenten-Repository, MIT-Lizenz.

```html example.html
<ui-component name="scrollbar" style="background-color:rgba(100,100,100,0.05);height:200px;width:300px" class="hidden" data-jc-class="hidden">
	<div>1</div>
	<div>2</div>
	<div>3</div>
	<div>4</div>
	<div>5</div>
	<div>6</div>
	<div>7</div>
	<div>8</div>
	<div>9</div>
	<div>10</div>
	<div>1</div>
	<div>2</div>
	<div>3</div>
	<div>4</div>
	<div>5</div>
	<div>6</div>
	<div>7</div>
	<div>8</div>
	<div>9</div>
	<div>10</div>
	<div>1</div>
	<div>2</div>
	<div>3</div>
	<div>4</div>
	<div>5</div>
	<div>6</div>
	<div>7</div>
	<div>8</div>
	<div>9</div>
	<div>10</div>
	<div>1</div>
	<div>2</div>
	<div>3</div>
	<div>4</div>
	<div>5</div>
	<div>6</div>
	<div>7</div>
	<div>8</div>
	<div>9</div>
	<div>10</div>
</ui-component>
```