Fórum | tutoriais mais recente desenvolvimento web
 

jQuery Mobile Exemplos


Páginas móveis jQuery

A página básica web móvel
páginas múltiplas
Caixa de diálogo

Exemplos explicou


jQuery Transitions móveis

efeito de fade
efeito flip
efeito fluxo
efeito pop
efeito de slides
efeito Slidefade
efeito slideUp
efeito slideDown
vire efeito
Sem efeito de transição
efeito inverso

Exemplos explicou


jQuery Mobile Botões

Criar um botão
botões embutidos
botões agrupados
botões Voltar
Alterar a cor do botão
Botões com ou sem cantos arredondados
Botões de tamanho pequeno ou regulares
Botões com ou sem sombras

Exemplos explicou


Botão Ícones jQuery Mobile

Adicionar ícones para os botões
Adicionar mais ícones (ícones introduzidas na versão 1.4)
ícones de posicionamento
Exibir apenas o ícone
Remover o círculo (disco) Mude a cor do ícone

Exemplos explicou


jQuery Mobile Popups

Criar um pop-up básico
Adicionar preenchimento e margem para o pop-up
Fechar o pop-up com um botão de fechar direita
Fechar o pop-up com um botão para fechar a esquerda
Popup Undismissible
popups de posicionamento
A transição popups
setas Popup
diálogos pop-up
fotos Popup

Exemplos explicou


jQuery barras de ferramentas móveis

Criar um cabeçalho e um rodapé
Adicionar botões no cabeçalho
Adicionar um botão para o lado esquerdo no cabeçalho
Adicionar um botão para o lado direito no cabeçalho
Rodapé com botões
Rodapé com centro alinhado botões
Rodapé com botões horizontalmente agrupados
Posição em linha - cabeçalho e rodapé em linha com o conteúdo da página
Posição fixa - cabeçalho e rodapé ficará posicionada na parte superior e inferior da página
Posição Fullscreen - cabeçalho e rodapé permanece posicionado na parte superior e na parte inferior, mas também sobre o conteúdo da página

Exemplos explicou


Bares jQuery Mobile Navigation

Criar uma barra de navegação
Ícones em botões de navegação
Barras de navegação no conteúdo
Barras de navegação no rodapé
Adicione o selecionado (pressionado) olhar para os botões em barras de navegação
Adicione o selecionado (pressionado) veja persistentemente
Ícones de posicionamento: o alinhamento superior
Ícones Posicionamento: alinhamento à direita
Ícones Posicionamento: alinhamento de fundo
Ícones Posicionamento: alinhamento à esquerda
Uma demonstração de 10 botões em uma barra de navegação

Exemplos explicou


Painéis jQuery Mobile

Criar um painel de base
Um painel com um botão de fechar
Alterar o visor do painel
Posição direita um painel
Posição do painel fixo

Exemplos explicou


jQuery Mobile collapsibles

Criar um bloco dobrável de conteúdos
Expandir o conteúdo quando a página é carregada
Blocos recolhíveis aninhados
Conjuntos selecionadas (acordeão)
Remover cantos arredondados em collapsibles
Faça collapsibles menor
Alterar o ícone de collapsibles
Mude a posição do ícone de collapsibles

Exemplos explicou


Tabelas jQuery Mobile

Criar uma tabela de refluxo
Criar uma tabela coluna de alternância
Alterar o texto de alternância botão de mesa
Adicionar sombras para a mesa
Adicionar um limite inferior para todas as linhas da tabela
Adicionar um background-color a todas as linhas da tabela

Exemplos explicou


jQuery Mobile Grids

Layout de duas colunas
Layout de três colunas
Disposição de quatro colunas
Disposição de cinco colunas
Personalize grades
Várias linhas dentro de colunas

Exemplos explicou


Listas jQuery Mobile

Criar exibições de lista
Exibições de lista com cantos arredondados
divisores lista
Autodividers
Criar listas de somente leitura
Inserir painéis para os itens da lista
Ícone link Alterar padrão para os itens da lista
Adicionar ícones para itens da lista
Adicionar miniaturas para itens da lista
Adicionar elementos HTML para preencher os itens da lista com informações
Criar listas com botões divididos
Faça os itens da lista mais funcional
Criar bolhas de contagem
listas pop-up
listas recolhíveis
Listas pop-up dobráveis
Listas recolhíveis largura total
Criar um calendário

Exemplos explicou


Filtros jQuery Mobile

Criar um campo de pesquisa para listas
Mudar o texto dentro do campo de pesquisa
Filtro personalizado
Filtrar listas recolhíveis
mesas de filtro
Filtrar um elemento <div>

Exemplos explicou


Forms jQuery Mobile

entradas de texto
Adicionando um ícone em botões de entrada
Adicionando um botão "clear" em insumos
área de texto
entrada da pesquisa
Botões do rádio
checkboxes
Botões de rádio e caixas de seleção horizontalmente Grupo
Recipientes de campo com os botões de rádio e caixas de seleção
Pré-selecione o botão de rádio / caixa
Coloque a forma dentro de um pop-up
Prevenir jQuery Mobile para estilizar elementos automaticamente tappable
Criar um menu de seleção
Criar selecionar menus com divisórias (optgroup)
Selecione Personalizado menus
Selecionar várias opções no menu de seleção
Menus de seleção de grupo
Menus de seleção de grupo horizontalmente
Menus de seleção minify
Pré-selecionar uma opção
seleções Popup
formas dobráveis
Alterar o ícone de seleção do padrão
Mude a posição do ícone
Criar um controle deslizante
Mostrar o valor no botão deslizante
Fazer o valor de pop-up na tela como o slide de usuário
Destaque a trilha até o valor controle deslizante
Deslizante Gama (dual)
Criar um interruptor aleta de alternância
Mudar o texto no interruptor da aleta
Pré-selecionar uma chave de aleta
Estilizar o interruptor da aleta

Exemplos explicou


Temas jQuery Mobile

Tema "a"
Tema "b"
Cabeçalho e rodapé Theming
diálogos Theming
botões Theming
ícones Theming
popups Theming
Botões Theming em cabeçalho e rodapé
Barras de navegação Theming
painéis Theming
Theming botão dobrável e conteúdo
listas Theming
Botões Theming divisão
Theming listas recolhíveis
formas Theming
Theming formas dobráveis
Personalize temas

Exemplos explicou


jQuery Mobile Eventos

evento Tap
evento Taphold
evento swipe
evento Swipeleft
evento Swiperight
evento Scrollstart
evento Scrollstop
Evento orientationChange - orientação Alerta
Evento orientationChange - Definir estilos diferentes para retrato e paisagem
Eventos de inicialização página
Eventos de carregamento de página
Eventos de transição página

Exemplos explicou