# j-ToggleMore

> Jest to prosty element do rozwijania treści.

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

Jest to prosty element do rozwijania treści.

- Możesz zmienić CSS w zależności od potrzeb.


__Metody__:

- `component.toggle(force)` Możesz rozwinąć element. parametry `force` Jest to opcjonalne i będzie miało wartość. `component.toggle(true);` będzie pokazywać `ui-togglemore-after`.

__Dobrze wiedzieć__:

Zawartość `j-ToggleMore` jest podzielona na 2 części: `before` i `after`.Każda część musi być zdefiniowana.Komponent dodaje klasy CSS do każdej części, na przykład pierwszy `div` będzie zawierać `ui-togglemore-before` i drugi `ui-togglemore-after`.
Aby uniknąć "blink" dodaj klasę `hidden` do drugiej `div`.

---

```html
<ui-component name="togglemore">
	<div>
		Content before
	</div>
	<div class="hidden">
		Content after
	</div>
</ui-component>
```

Użyj go z `<ui-component name="togglemore">`Gdy element nie jest jeszcze ładowany, jComponent Pobierz go po pierwszym użyciu z adresu `DEF.fallback` (Wydaje się Componentator Autor: Denis Granec Źródło: Componentator Zestaw składników, licencja MIT.

```html example.html
<div style="width: 400px">
	<ui-component name="togglemore">
		<div>
			BEFORE long text
		</div>
		<div class="hidden">
			AFTER Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda eligendi pariatur perferendis expedita tempora, deserunt sunt, quas similique velit quo, harum odio explicabo ea dicta aliquam ipsa, veniam vitae nemo.
		</div>
	</ui-component>
</div>
```