Lay-out padrão sem repetição

1. Lay-out padrão sem repetição

lulaphbpi
(usa Ubuntu)

Enviado em 26/08/2013 - 09:39h

Desenvolvi um lay-out padrão modelando minha página principal dividindo-a nas seções div "header", "menu principal", "menu esquerda", "área de trabalho" (centro à direita) e "rodapé". Minha pretenção é manter esse lay-out constante para qualquer operação, isto é, a cada chamada no servidor mantenho o status atual da página e altero apenas a seção "área de trabalho". O que desejo é não clonar a mesma página em arquivos para cada alteração da seção "área de trabalho".

Tentando esclarecer em passos:

1. chamando minha página inicial de index.php

2. a página index.php é exibida e tem no menu a opção "Informações"

3. o usuário ao clicar em "Informações", para ter o resultado, vai chamar outra página, por exemplo, "informacoes.php" com o mesmo conteúdo de "index.php", alterada apenas a seção "área de trabalho" a qual conterá as informações desejadas. A página "informacoes.php" é um clone de "index.php" com alteração em uma seção. Não desejo isso. Desejo que ao clicar em informações a página chamada apenas substitua a seção "área de trabalho" sem necessidade de ter um clone.

Espero que tenham entendido e possam ajudar-me.

Grato por quem interessar.

0 0

Quote

2. Re: Lay-out padrão sem repetição

luisrcs
(usa Linux Mint)

Enviado em 26/08/2013 - 11:39h

Tem que usar jquery.

0 0

Quote

3. Re: Lay-out padrão sem repetição

luisrcs
(usa Linux Mint)

Enviado em 26/08/2013 - 11:42h

E não é php é javascript.

0 0

Quote

4. Re: Lay-out padrão sem repetição

luisrcs
(usa Linux Mint)

Enviado em 26/08/2013 - 11:48h

O que você quer é uma página com vários campos controladas por div's e que uma delas seja alterada ficando as outras fixas.

0 0

Quote

5. Re: Lay-out padrão sem repetição

luisrcs
(usa Linux Mint)

Enviado em 26/08/2013 - 12:00h

Acho que isso resolve:

http://www.novidades100.com.br/dicas/funcoes-jquery.html

0 0

Quote

6. Lay-out padrão sem repetição em php

lulaphbpi
(usa Ubuntu)

Enviado em 26/08/2013 - 14:09h

Alguém me escreveu:

"
Então na verdade você quer utilizar uma unica página que tem uma div que vai ser atualizada certo?

O que você pode fazer é fazer essas telas em cada arquivo, como eu havia dito e ai dentro da tela index.php vai ter a div que será atualizada, então quando o cara clicar no menu, vocẽ passa uma url com a variavel que ira atualizar a div exemplo:

"index.php?tipo=contato"

ai você vai pegar essa variavel usando GET e vai fazer um switch, dependendo do conteúdo você faz um include diferente.

Entendeu?

Este é um modo rápido pra resolver a situação, devem ter modos mais elegantes pra fazer isso, mas assim já resolve sem problemas.

"
É essa a idéia, mas preciso de um exemplo prático, esclarecedor e funcional para prosseguir...

0 0

Quote

7. Re: Lay-out padrão sem repetição

luisrcs
(usa Linux Mint)

Enviado em 26/08/2013 - 18:14h

Então vamos lá ao exemplo:

Crie um arquivo index.html com o seguinte conteúdo:



<html>

  <head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

      <script type="text/javascript">

        $(document).ready(function(){

          $('#menu a').live('click',function(){

            $('#conteudo').load($(this).attr('href'));

            return false;

          });

        });

      </script>

    </head>

    <body>

      <ul id="menu">

        <li><a href="arquivo1.html">mudanca 1</a></li>

        <li><a href="arquivo2.html">mudanca 2</a></li>

        <li><a href="arquivo3.html">mudanca 3</a></li>

      </ul>

      <h1>INÍCIO</h1>

      <div id="conteudo">

        Aqui as coisas mudam!!!

      </div>

    </body>

</html>

Crie mais três arquivos com os nomes arquivo1.html, arquivo2.html arquivo3.html, escreva o que quiser, salvando sempre na mesma pasta do arquivo principal.

Teste, estude o código e retorne se tiver dúvidas.

0 0

Quote

8. Re: Lay-out padrão sem repetição

luisrcs
(usa Linux Mint)

Enviado em 26/08/2013 - 19:06h

Esqueci de uma coisa, tem que está com internet para funcionar. Caso contrário é só baixar o jquery e referenciar o seu caminho no cabeçalho.

0 0

Quote

9. Re: Lay-out padrão sem repetição

dungamaster
(usa Debian)

Enviado em 02/09/2013 - 10:04h

lulaphbpi escreveu:

Alguém me escreveu:

"
Então na verdade você quer utilizar uma unica página que tem uma div que vai ser atualizada certo?

O que você pode fazer é fazer essas telas em cada arquivo, como eu havia dito e ai dentro da tela index.php vai ter a div que será atualizada, então quando o cara clicar no menu, vocẽ passa uma url com a variavel que ira atualizar a div exemplo:

"index.php?tipo=contato"

ai você vai pegar essa variavel usando GET e vai fazer um switch, dependendo do conteúdo você faz um include diferente.

Entendeu?

Este é um modo rápido pra resolver a situação, devem ter modos mais elegantes pra fazer isso, mas assim já resolve sem problemas.

"
É essa a idéia, mas preciso de um exemplo prático, esclarecedor e funcional para prosseguir...

Essa forma é uma boa opção, passa uma variavel por get "index.php?pagina=contato" e programa a pagina pra verificar o dado recebido e fazer um include("contato.php") com a div responsavel pelo conteudo da pagina contato, segue um codigo abaixo:

if (isset($_GET['pagina'])){

if ($_GET['pagina'] = 'contato'){

include("contato.php"); //Div contato;

}
}

Outra forma, talvez mais simples seria o uso de iframes.

0 0

Quote