# j-Display

> Il componente calcola automaticamente l'intervallo tra le visualizzazioni. il tipo di display predefinito è lg.

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

Il componente misura una dimensione dello schermo in base all'elemento corrente. utilizza il metodo `WIDTH()` e aggiunge una classe CSS nel modulo `jc-DISPLAY_SIZE`:

- `jc-xs` display extra piccolo (telefono mobile)
- Il piccolo display di `jc-sm` (tabletta)
- Display medio di `jc-md` (laptop)
- `jc-lg` grande display (computer desktop)

__Configurazione__:

- `delay {Number}` un ritardo per ottenere la dimensione (default: `100` ms)
- __NEW__: `xs {Number}` una larghezza massima per l'esposizione minore (default: `768`)
- __NEW__: `sm {Number}` una larghezza massima per il piccolo display (default: `992`)
- __NEW__: `md {Number}` una larghezza massima per la visualizzazione media (default: `1200`)

Il componente calcola automaticamente l'intervallo tra i display. il tipo di display predefinito è `lg`.

Utilizzare con `<ui-component name="display">`Quando il componente non è ancora caricato, jComponent Scarica il codice in prima utilizzazione dall'indirizzo `DEF.fallback` (Il Componentator La storia di Peter Širka.Fonte: il Componentator Ristorante dei componenti, licenza MIT.

```html example.html
<div style="width:500px;padding:10px;border:1px solid #E0E0E0">
	<ui-component name="display" path="common.xs">
		<ui-bind path="common.xs" config="text" class="block"></ui-bind>
	</ui-component>
</div>
<br />
<div style="width:800px;padding:10px;border:1px solid #E0E0E0">
	<ui-component name="display" path="common.sm">
		<ui-bind path="common.sm" config="text" class="block"></ui-bind>
	</ui-component>
</div>
<br />
<div style="width:1080px;padding:10px;border:1px solid #E0E0E0">
	<ui-component name="display" path="common.md">
		<ui-bind path="common.md" config="text" class="block"></ui-bind>
	</ui-component>
</div>
<br />
<div style="width:1380px;padding:10px;border:1px solid #E0E0E0">
	<ui-component name="display" path="common.lg">
		<ui-bind path="common.lg" config="text" class="block"></ui-bind>
	</ui-component>
</div>
<br />
```