# j-ScrollPercentage

> Komponenten måste fästas på elementet som kommer att vara som en skruvbehållare. för hela fönstret använd kroppselementet.

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

Komponenten måste fästas på det element som kommer att vara som en skruvbehållare. för hela fönstret använder du `body`-elementet.


__Konfigurera__:

- `exec {String}` En länk till den globala funktionen som utförs om procenten ändras

__IMPORTANT__: Om `exec` inte är definierad så binder komponenten ett värde enligt `path`.

Använd den med `<ui-component name="scrollpercentage">`När komponenten ännu inte är laddad, jComponent Ladda ner den första gången från adressen i `DEF.fallback` (en av Componentator Författare: Peter Širka. källa: The Componentator Komponenterna i lager, MIT licens.

```html example.html
<ui-bind path="common.scroll" config="exec div:myProgress" style="border: 1px solid #D0D0D0;padding:2px" class="block"><div style="height:10px;background-color:#79B34C"></div></ui-bind>
<br />
<ui-component name="scrollpercentage" path="common.scroll" style="height:400px;overflow-y:scroll">
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
	<div>Text</div>
</ui-component>

<script>
	function myProgress(value, path, el) {
		el.css('width', value + '%');
	}
</script>
```