JQueryMobile HTML5, JavaScript e CSS5 para multiplataforma.

Apresentação em tema: "JQueryMobile HTML5, JavaScript e CSS5 para multiplataforma."— Transcrição da apresentação:

1 JQueryMobile HTML5, JavaScript e CSS5 para multiplataforma

2 Agenda Formatação de Conteúdo – Estilização Básica; – Textos Truncados; – Mostras e Esconder conteúdo; – Efeito Acordeão

3 ESTILIZAÇÃO BÁSICA Formatação de Conteúdo

4 ESTILIZAÇÃO BÁSICA Por padrão, respeita a formatação e renderização padrão do browser; Alguns exemplos;

5 ESTILIZAÇÃO BÁSICA Cabeçalho H1 Cabeçalho H2 Cabeçalho H3 Cabeçalho H4 Cabeçalho H5 Cabeçalho H6

6 ESTILIZAÇÃO BÁSICA

7 Primeiro Parágrafo Segunda Parágrafo Terceiro Parágrafo com elemento negrito e ênfase no link. Exemplo de uso da tag code Abacaxi Abacate Amora Melancia Maça Pera

8 ESTILIZAÇÃO BÁSICA

9 Grêmio Inter Juventude Aimoré Sport de David Canabarro JQueryMobile Multiplataform... UPF Universidade de Passo Fundo

10 ESTILIZAÇÃO BÁSICA

11 Venda de Carros Corcel Fusca Gol......

12 ESTILIZAÇÃO BÁSICA

13 TEXTOS TRUNCADOS Formatação de Conteúdo

14 ESTILIZAÇÃO BÁSICA Comportamento padrão:

15 ESTILIZAÇÃO BÁSICA Sobrescrever regras de estilo do framework;.ui-header.ui-title,.ui-footer.ui-title { white-space: normal !important; }

16 MOSTRAS E ESCONDER CONTEÚDO Formatação de Conteúdo

17 MOSTRAR E ESCONDER Data-role: collapsible; Primeiro será o cabeçalho; Podem existir inúmeras outras tags ; Inicialmente fechado. Possível mudar com propriedade: data-collapsible=false

18 ESTILIZAÇÃO BÁSICA Meses do Ano Na linguagem portuguesa temos Janeiro...

19 MOSTRAR E ESCONDER Temas customizáveis através das propriedades: data-theme; data-content-theme; O primeiro estiliza o botão de ocultar/mostrar, já o segundo a área de conteúdo;

20 MOSTRAR E ESCONDER... <div data-role="collapsible" data-theme="b" data-content-theme="e"> Meses do Ano...

21 EFEITO ACORDEÃO Formatação de Conteúdo

22 EFEITO ACORDEÃO data-role collapsible-set com vários data-role collapsible; Todos os recursos vistos anteriormente podem ser aplicados; Fechamento automático

23 ESTILIZAÇÃO BÁSICA... Rio Grande do Sul... Santa Catarina......