# j-ToggleMore

> È un semplice componente per toggle contenuti.

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

È un semplice componente per toggle contenuti.

- Puoi cambiare il CSS per le tue esigenze.


__Metodi__:

- `component.toggle(force)` Può essere utilizzato il componente. il parametro `force` è opzionale e fornirà il valore. `component.toggle(true);` Mostrerà `ui-togglemore-after`.

__Buono sapere__:

Il contenuto del `j-ToggleMore` è suddiviso in 2 parti: `before` e `after`. Ogni parte deve essere definita. il componente aggiunge classi CSS a ciascuna parte, ad esempio il primo `div` contiene `ui-togglemore-before` e il secondo `ui-togglemore-after`.
Per evitare "blink" aggiungere la classe `hidden` al secondo `div`.

---

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

Utilizzare con `<ui-component name="togglemore">`Quando il componente non è ancora caricato, jComponent Scarica il codice in prima utilizzazione dall'indirizzo `DEF.fallback` (Il Componentator La storia di Denis Granec. fonte: il Componentator Ristorante dei componenti, licenza 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>
```