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

lâmpada 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.
lâmpada 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 »
A página jQuery Mobile
10/30