j-Scrollbar

jComponent 20 · jcomponent@20 component Příklad načten s jComponent 20

Přizpůsobené přepínače. IMPORTANT: Vrací aktuální obsah tím, že přidává dva nestované prvky div s polohou relative. To funguje s jComponent v17 pouze.

Konfigurace:

parent {String} selektor pro mateřský prvek, může obsahovat window (předvolený: undefined)
visibleX {Boolean} vždy ukazuje horizontální sklon (podmínkou: false)
visibleY {Boolean} vždy zobrazuje vertikální sklon (podmínkou: false)
offset {Boolean} přidává offset.top tohoto prvku (předvolený: false)
reset {Boolean} obnoví pozici, pokud je změněn path (podle předvolby: true)
margin {Číslo} marže pro všechny typy displejů (předvolené: 0)
marginxs {Číslo} marže pro displeje XS (předvolené: 0)
marginsm {Číslo} marže pro displeje SM (předvolené: 0)
marginmd {Číslo} marže pro displeje MD (předvolené: 0)
marginlg {Číslo} marže pro displeje LG (předvolené: 0)
track {String} může sledovat pouze definované trasy, např. FIELD1,FIELD2,FIELD3, trasy budou propojeny s component.path

Metody:

component.reset() obnovuje pozici na 0,0
component.scrollleft(val) Skládací X
component.scrolltop(val) Sklíčení Y
component.scrollright(val) se otáčí X z pravé strany
component.scrollbottom(val) se otáčí z dolní strany
component.scroll(x, y) skříňky X,Y
component.resize() rezuje kontejner (reaguje automaticky na události resize)

Použijte ji s <ui-component name="scrollbar">Pokud je součástka ještě nezačleněna, jComponent Stáhnout ji na první použití z adresy DEF.fallback a) The Componentator CDN dle předvolby. autor: Peter Širka. zdroj: Componentator Výrobce je autorizován, MIT licence.

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>