# j-ToggleMore

> Det är en enkel komponent för att ta tag i innehållet.

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

Det är en enkel komponent för att ta tag i innehållet.

- Du kan ändra CSS för dina behov.


__Metoder__:

- `component.toggle(force)` kan ta tag i komponenten. parametern `force` är valfri och kommer att tvinga värdet. exempelvis `component.toggle(true);` visar `ui-togglemore-after`.

__Bra att veta__:

Innehållet i `j-ToggleMore` är uppdelat i 2 delar: `before` och `after`.Varje del måste definieras.Komponenten lägger till CSS-klasser till varje del, till exempel den första `div` kommer att innehålla `ui-togglemore-before` och den andra `ui-togglemore-after`.
För att undvika "blink" lägg klassificeringen `hidden` till den andra `div`.

---

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

Använd den med `<ui-component name="togglemore">`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: Denis Granec. källor: den Componentator Komponenterna i lager, MIT licens.

```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>
```