O melhor tutorial A página jQuery Mobile em 2024. Neste tutorial você pode aprender
Começar a aprender jQuery Mobile,Exemplos,Adicionando jQuery Mobile na página,Exemplos,Página como os usos de diálogo,Exemplos,
A página jQuery Mobile
Começar a aprender jQuery Mobile
| Embora jQuery Mobile é compatível com todos os dispositivos móveis, mas não totalmente compatível com o PC (devido ao suporte CSS3 limitada).
Para ler melhor este tutorial, nós recomendamos que você usa o navegador Google Chrome. |
---|
Exemplos
<body>
<div data-role="page" >
<div
data-role="header" >
<h1>欢迎来到我的主页</h1>
</div>
<div data-role="main" class="ui-content" >
<p>我现在是一个移动端开发者!!</p>
</div>
<div data-role="footer" >
<h1>底部文本</h1>
</div>
</div>
</body>
tente » exemplos de análise:
- data-role = "página" é a página no navegador para exibir.
- data-role = "header" é uma barra de ferramentas na parte superior da página é criado (geralmente usado para o botão de busca título ou)
- data-role = "main" define o conteúdo da página, como texto, imagens, formas, botões e assim por diante.
- classe "-content Ui" para que esta página preenchimento e margens.
- data-role = "footer" usado para criar o fundo da barra de ferramentas principal.
- Nestes recipientes que você pode adicionar elementos HTML - parágrafos, imagens, títulos, listas, etc.
| jQuery Mobile contar com HTML5 data- * atributos para apoiar vários elementos de interface do usuário, transição e estrutura da página. Navegador não suporta eles serão descartados silenciosamente. |
---|
Adicionando jQuery Mobile na página
Use jQuery Mobile, você pode criar um único arquivo HTML em um número de páginas diferentes.
Você pode usar o atributo href diferente para distinguir entre utilizando o mesmo ID exclusivo da página:
Exemplos
<Div em função de dados = "página " id = "pageone">
<Div data-role = "main" class = "ui-content">
<a href="#pagetwo"> para saltar para uma segunda página </a>
</ Div>
</ Div>
<Div em função de dados = "página " id = "pagetwo">
<Div data-role = "main" class = "ui-content">
<a href="#pageone"> para saltar para a primeira página </a>
</ Div>
</ Div>
tente » Nota: Quando as aplicações web tem um monte de conteúdo (texto, imagens, scripts, etc.) vai afetar seriamente o tempo de carregamento. Se você não quiser usar links em páginas que você pode usar um arquivo externo:
<a href="externalfile">访问外部文件</a>
Página como os usos de diálogo
caixa de diálogo é usada para exibir as informações de exibição de informações de página ou formulário de entrada.
Adicione o link-rel data = box "diálogo" pop-up de diálogo permite que os usuários a clicar no link:
Exemplos
<Div data-role = "página" id = "pageone">
<Div data-role = "main" class = "ui-content">
<a href="#pagetwo"> salto para uma segunda página </a>
</ Div>
</ Div>
<Div em função de dados = "página "-de diálogo de dados = "true" id = "pagetwo">
<Div data-role = "main" class = "ui-content">
<a href="#pageone"> salto para a primeira página </a>
</ Div>
</ Div>
tente »