ForgeComponentes
pt

Componentes

j-Display

jComponent 20 · jcomponent@20 component Exemplo carregado com jComponent 20

O componente mede um tamanho de exibição de acordo com o elemento atual. usa o método WIDTH() e adiciona uma classe CSS no formulário jc-DISPLAY_SIZE:

  • jc-xs - Exposição de Pequeno Telemóvel
  • jc-sm Pequeno Display (Tabela)
  • Exibição média de jc-md (Laptop)
  • jc-lg grande tela (computador de desktop)

Configuração:

  • delay {Number} um atraso para obter tamanho (default: 100 ms)
  • NEW: xs {Number} uma largura máxima para a tela extra pequena (default: 768)
  • NEW: sm {Number} uma largura máxima para o pequeno ecrã (default: 992)
  • NEW: md {Number} uma largura máxima para a tela média (default: 1200)

O componente calcula automaticamente o intervalo entre os ecrãs.O tipo de ecrão padrão é lg.

Use-o com <ui-component name="display">Quando o componente ainda não está carregado, jComponent Descarrega-o no primeiro uso do endereço DEF.fallback (a partir do Componentator CDN por padrão). autor: Peter Širka. fonte: o Componentator Reserva de componentes, licença MIT.

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