Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

lsteffler

O que e como usar no lugar de IFRAME?

Por , em Desenvolvimento frontend

Recommended Posts

lsteffler    0

lsteffler
Postado

beleza galera!

 

Estao me recomendando o uso de AJAX no lugar de iframe, porem nao encontrei nada na net q me ajudasse a criar isso, com o iframe parece-me tao simples e funcional, mas varios colegas me dizem para parar de usar iframe...

Ja me falaram pra fazer todas as paginas novas, mas carregar tda a pagina de novo qd só preciso de um bloco de texto no centro? desperdicio de transferencia nao acham?

 

Bom, espero q alguem possa me ajudar com um exemplo pratico e tao funcional qto ao iframe. grato...

 

a exemplo, este site q estou montando: http://lsteffler.freeweb7.com/04dejulho/default.php onde no centro vai abrir os conteudos relacionados no menu..

 

vlw!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Nícolas    4

Nícolas
Postado

Aaaa cara se você quer mesmo usar AJAX no seu site de uma forma simples faz assim

http://www.webly.com.br/tutorial/javascrip...a-e-simples.htm

 

EXEMPLO DE COMO UTILIZAR TIRADO DO SITE

<html><head><script src="engine/micoxAjax.js?12" type="text/javascript" language="javascript"></script><script>function carrega(pagina){	ajaxGet(pagina,document.getElementById("recebe"),true)}</script></head><body><ul><li><a href="teste1.htm" onclick="carrega('teste1.htm');return false;">Link teste 1</a></li><li><a href="teste22.htm" onclick="carrega('teste22.htm');return false;">Link teste 22</a></li></ul><div id="recebe">Esta div irá receber o conteudo.</div></body></html>

 

Eu particularmente não curto tanto usar AJAX em troca de conteúdo pois o botão de voltar fica inativo.

 

Tem maneiras de habilita-lo (Google fez isso com o GMail)

 

Mas pra fazer isso é um trabalho danado.

 

Bom ai vai de você usar AJAX, eu acho ele mais proveitoso pra fazer verificações dinâmicas em banco de dados e outras coisas mais.

 

:rolleyes:

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovani    104

Giovani
Postado

Título do tópico editado conforme Regras do Fórum iMasters

Sai: [Ajuda] - O que e como usar no lugar de IFRAME?

Entra: O que e como usar no lugar de IFRAME?

 

Sobre a sua dúvida, pesquise aqui no fórum, existem muitos posts com a mesma dúvia que a sua.

Uma dica, includes php ou asp.

Compartilhar este post

Link para o post
Compartilhar em outros sites

brcontainer    16

brcontainer
Postado

você tbm pode usar "includes" de linguagens SERVER-SIDE como por exemplo:

PHP, ASP, JAVA, COLD-FUISON, Python, entre outras

 

em PHP seria assim

 

exemplos:

<?php include("pagina.php");?>
em asp assim:

<!--#include virtual="/planilha.asp"-->ou<!--#include file="planilha.asp"-->
você pode crias um cabecario e um rodape

tipo assim:

<?php include("cabecario.php"); ?> <~parte de cima da páginaconteudo <~representa o conteudo q iria no frame<?php include("rodape.php"); ?> <~parte de baixo da página
assim qualquer alteração no cabecario ou rodape ja "modificaria" de todas páginas ^^

Compartilhar este post

Link para o post
Compartilhar em outros sites

Nícolas    4

Nícolas
Postado

Já que tocaram no assunto se pode fazer com PHP usando um arquivo como template

 

 

Você salva esse arquivo com o nome de index.php

 

<?$cont .= ".php";if (!file_exists ($cont)) $cont = 'home.php';?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title></head><body><div id="site">	<div id="topo"></div>		<div id="area">			<div id="menu">				<ul>					<li><a href="?cont=home">Home</a></li>					<li><a href="?cont=empresa">Empresa</a></li>					<li><a href="?cont=contato">Contato</a></li>				</ul>			</div>			<div id="conteudo">				<?						//	CONTEUDO DO SITE					include $cont;				?>			</div>		</div>	<div id="rodape"></div></div></body></html>
Aee é só você criar os arquivos SOMENTE com o conteudo.

 

home.php

empresa.php

contato.php

 

Aeee quando você quiser chamar uma pagina ao inves de chamar no link como home.php ou contato.php por exemplo.

 

Você chama assim ?cont=home, ?cont=contato

 

E nesse exemplo se o arquivo que você for chamar não existir ele chama o home.php

 

O legal é que você pode editar com facilidade no Dreaweaver pois a index será toda visivel no modo design.

 

Ja se você separar o cabeçalho do rodapé ja complica mais um pouco nesse ponto, mas o efeito é o mesmo

 

=]

 

O bom de include é que você altera a index (adiciona um item no menu por exemplo) ele ja altera em todas as paginas :)

 

 

(LEMBRANDO QUE ESSES ESQUEMAS DE INCLUDES RECARREGAM TODO O CÓDIGO NOVAMENTE NÃO SÓ O CONTEÚDO COMO VOCÊ TINHA CITADO LA EM CIMA)

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

brcontainer    16

brcontainer
Postado

nick171 muito boa alternativa ^^eu só não há usei no meu ultimo site pq fiz conformemeu cliente queria ele queria os nomes inteiros :Pmas vou adaptar ao seu metodo no meu proprio site (q está em construção)recomendo a ideia do nick171AJAX tem de se saber aplicar bem acho q carregar páginas inteiras funciona mas não coveme frames é um verdadeiro dinosauro kkkabraços ^^

Compartilhar este post

Link para o post
Compartilhar em outros sites

Nícolas    4

Nícolas
Postado

Opaaa cara tamo aee..

 

Apenas retificando o que eu havia dito sobre o ajax....

 

no meu trampo num sei pq num carregou toda a pagina mas aqui eu tentei abrir de novo e carregou...

 

postaram uma solução para habilitar o botão de voltar

http://forum.ievolutionweb.com/index.php?showtopic=10670

 

Realmente funciona, mas tem aquela de navegador compativel e etc...

 

E reparem na url do site

 

Ele habilita o botão de voltar do navegador, mas indexar em site de busca é luxo :P

Compartilhar este post

Link para o post
Compartilhar em outros sites

Guilherme Rambo    4

Guilherme Rambo
Postado

É, eu não recomendo mesmo carregar páginas internas com ajax, pois há diversos inconvenientes (botão voltar no navegador, url, etc) e acaba dando mais trabalho do que deveIncludes server-side, essa é a solução[]'s

Compartilhar este post

Link para o post
Compartilhar em outros sites

lsteffler    0

lsteffler
Postado

nick171 achei muito bacana sua idéia, minha programação será em php mesmo...

 

achei o seguinte no site http://www.webmorphos.com/ :

 

<!----------------------------------------------------->	<!------------- Criado por Allan d´El-Rei ------------->	<!------------- http://www.webmorphos.com ------------->	<!----------------------------------------------------->	<script type="text/javascript">		/*função básica para iniciar o uso do Ajax no site*/		function ajaxInit() {			var req;			try {			 req = new ActiveXObject("Microsoft.XMLHTTP");			} catch(e) {			 try {			  req = new ActiveXObject("Msxml2.XMLHTTP");			 } catch(ex) {			  try {			   req = new XMLHttpRequest();			  } catch(exc) {			   alert("Esse browser não tem recursos para uso do Ajax");			   req = null;			  }			 }			}			return req;			}			function wmCarrega(webmorphos){				/*	webmorphos é a variavel que recebe o link					seto a variável wmDiv pra receber o corpo da div conteúdo que irá receber os dados finais					isto serve apenas para facilitar a escrita, já que iremos repetir a div*/				var wmDiv = document.getElementById("conteudo");				ajax = ajaxInit(); /*Inicia o Ajax*/				ajax.open("GET", webmorphos, true); /*Envia a requisição ao servidor*/				ajax.onreadystatechange=function() {					 /* readyState==1 Indica que está carregando, nessa hora que colocamos aquele Loading...*/					 if (ajax.readyState==1){							wmDiv.innerHTML = "<p style='text-decoration: blink;'>Carregando...</p>"; /*se preferir faça um gif piscando sei la*/						}					if (ajax.readyState==4){						/*readyState==4 Indica que está carregada a página*/						wmDiv.innerHTML = ajax.responseText; /*envia à div o conteúdo*/					}				}				ajax.send(null);			}	</script>	<html>	<head><title>Testando Ajax com Webmorphos.com</title></head>	<body>		<p>Modelo simples de uma função bastante útil em Ajax</p>		<p>Links: <a href="java script:wmCarrega('esportes.html');">Esportes</a> :: <a href="java script: wmCarrega('piadas.html');">Piadas</a>		<p>A div abaixo receberá os dados ao clicar nos liks</p>		<div id="conteudo" style="margin-top: 10px; border:1px solid black; weight: 500px;">		</div>	</body>	</html>

Editando.....

 

 

Kra, gostei do tal do include... ja tinham me falado pra usá-lo mas nao sabia como, estou começando no php..

Montei aqui e funcionou para a pagina principal...

porém...

 

os menus nao carregam nada, nao abre nem no centro nem em lugar algum... estou tentando mexer aqui pra ver se descubro onde ta a falha...

 

Vlw!!!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Nícolas    4

Nícolas
Postado

hehhee bom cara eu trabalho como designer mas eu aprendi a programar também pra me virar sozinho e não depender dos outros.

 

Comecei a criar sistemas em PHP e MySQL já fiz sistemas grandinhos, agora ja to manjando até que bastante de javascript.

 

E isso tem sido ótimo pra mim pois tem feito um diferencial danado no meu serviço, tanto que Javascript, PHP, ASP, CGI é tudo linguagem baseada em C

 

E como eu sou designer eu que monto as estruturas dos sites que crio em html, css e etc.

 

Inclusive sites em flash, e hoje ja to adiquirindo um conhecimento legal do action script (que tb é baseado em C) ou seja, peguei rapidão as manhas.

 

E consegui melhorar e adiantar muitas coisas e até facilitar a minha vida e dos outros pra atualizar.

 

Sem falar que pra fazer trabalho para os outros eu não dependo de ninguem =)

 

Tem gente que separa, designer é designer, programador é programador.

 

Mas tudo tem uma ligação, e se você é designer, sabe o que fazer e como fazer pra agilizar o lado da programação, sem falar nos trampos por fora né.

 

E linguagens que um designer precisa aprender a mecher como actionscript se torna muito mais facil quando você aprende a programar.

 

Uma dica que te dou é procurar aprender sim alguma linguagem até algumas.

 

Vai atras de tutoriais, posta duvidas no fórum

http://forum.imasters.com.br/index.php?showforum=3

 

Corre atrás...

 

Programação no inicio é complicado, precisa ter muita força de vontade, mas vale a pena viu.

 

=)

 

 

Bom... ta aee minha dica ;)

 

Flw

Compartilhar este post

Link para o post
Compartilhar em outros sites

Guilherme Rambo    4

Guilherme Rambo
Postado

Isso!Mesmo que você não vá trabalhar como programador, é muito bom saber uma linguagem de programação, até porque ajuda no costume com códigos, que você também precisará saber quando for fazer design (html e css)[]'s

Compartilhar este post

Link para o post
Compartilhar em outros sites

lsteffler    0

lsteffler
Postado

Obrigado pessoal!

 

Aqui tb eu q faço tudo, layout programação, só que, eu fazia layout cheio de tabelas e programação em asp (nao entendo muito de asp tb, sabe, aquilo q preciso procuro na net e vou modificando conforme minha vontade) programar algo do zero, sozinho, nao cheguei a fazer.

 

Agora por insistencia de um amigo meu e tb lendo sobre as inúmeras vantagens, comecei o layout com css e vou fazer a programação deste em php.

 

Para o sistema de iframe consegui solucionar da seguinte maneira:

 

No inicio do default.php:

<?php		function content($value) {				$contents = array (					'principal' => 'principal.php',					'sobre'	 => 'sobre.php',					'contatos'  => 'contatos.php',				);			$content = $contents[$value];				if(file_exists($content)) {					include($content);				}				else {					die('O Arquivo <strong>' . $value . '</strong> não foi encontrado!');				};		};?>

No menu:

<div id="menu">					<ul>						<li><a href="?pagina=principal" id="current">Home</a></li>						<li><a href="?pagina=sobre">Sobre a Escola</a></li>						<li><a href="?pagina=contatos">Contatos</a></li>					</ul>				</div>

E na div onde é para aparecer os conteudos:

<div id="conteudo">					<?php					include $content;					?>										<?php					$request = $_SERVER['QUERY_STRING'];										switch($request) {											default :								content('principal');									break;											case "pagina=sobre" :								content('sobre');									break;											case "pagina=contatos" :								content('contatos');									break;										};					?>					</div>

Com uma forcinha dum amigo meu chegamos a isso, e funcionou perfeitamente...

 

Novamente, obrigado pela ajuda!

Abraços!

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito