Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Primeiras postagens
Primeiras postagens
Tópico Autor
Mensagens: 7
Nome: Josano

Carregar html via Jquery

19-03-2011 13:39

Pessoal,

Estou montando um site mas esbarrei numa duvida em relação a como carregar conteudo automaticamente.
Tenho uma pasta HTML onde estáo todos os documentos html, estes documentos são carregados por um iframe.
Criei um script para carregar o conteudo pela direita, porem só anima o primeiro link clicado, os demais carregam sem o efeito.
Alguém pode me ajudar, tentei varias alternativas mas não consigo resolver por ter pouco conhecimento em jquery.
Segue o codigo do html:

<html>     <header>       <link href="css/estilos.css" rel="stylesheet" type="text/css">         <style type="text/css"> h1 {   font-size:        120%;   text-align:       center; }     </style>         <script src="http://code.jquery.com/jquery-1.5.js"></script>     </header>         <body>     <div class="info">     <div id="header">             <div align="center"><img  align="center" width="80px" height="83px" src="imagem/escola.gif"><h1>ESCOLA VINCENT</h1></div>     </div>       <div id="sidebar">                  &bull;<a target="Conteudo"  class="block" href="html/inicial.html">Principal</a><br />             &bull;<a target="Conteudo" class="block" href="html/sobre.html">Sobre o curso</a><br />             &bull;<a target="Conteudo" class="block" href="html/estrutura.html">Estrutura do curso</a><br />             &bull;<a target="Conteudo" class="block" href="html/admissao.html">Admissão</a><br />             &bull;<a target="Conteudo" class="block" href="html/cadastro.html">Cadastro</a>     </div>      <div id="main">       <iframe id="iframe" name="Conteudo" src="html/inicial.html" frameborder="0" marginheight="0" marginwidth="0"  width="600" height="348" scrolling="no"></iframe>     </div>       <div id="footer">       &copy; 2011,  Escola Vincent     <br />        Todas as marcas registradas que aparecem neste site pertencem a seus respectivos proprietários.     </div>     </div> //                <script> $( ".block" ).click(function(event){   $( "#main" ).animate({     width: 600   }, {     duration: 1000,     step: function( now, fx ){       $( "#main:gt(0)" ).css( "right", now );     }     }); }); </script>             </body>   </html>

obrigado,
Josano
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17513
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Carregar html via Jquery

19-03-2011 14:47

Não entendi o efeito que você quer fazer. Seria isso?

http://www.ndoherty.biz/demos/coda-slider/2.0/#4
0
A melhor hospedagem para o seu site HostGator!
 
Primeiras postagens
Primeiras postagens
Tópico Autor
Mensagens: 7
Nome: Josano

Carregar html via Jquery

19-03-2011 19:52

Ola web,

Obrigado pela resposta.
Na verdade o que desejo é animar o arquivo html quando ele for carregado na div, quando o usuario clicar no link quero que o html venha pela direita.

esses é a div que contem os links.

<div id="sidebar">                  &bull;<a target="Conteudo"  class="block" href="html/inicial.html">Principal</a><br />             &bull;<a target="Conteudo" class="block" href="html/sobre.html">Sobre o curso</a><br />             &bull;<a target="Conteudo" class="block" href="html/estrutura.html">Estrutura do curso</a><br />             &bull;<a target="Conteudo" class="block" href="html/admissao.html">Admissão</a><br />             &bull;<a target="Conteudo" class="block" href="html/cadastro.html">Cadastro</a>     </div>

Esta é a div onde o html é carregado

   <div id="main">       <iframe id="iframe" name="Conteudo" src="html/inicial.html" frameborder="0" marginheight="0" marginwidth="0"  width="600" height="348" scrolling="no"></iframe>     </div>

Este é o script que fiz só que ele só anima a entrada pela direita ao clicar no primeiro link. se vc tentar navegar nao carrega vindo pela direita.

<script> $( ".block" ).click(function(event){   $( "#main" ).animate({     width: 600   }, {     duration: 1000,     step: function( now, fx ){       $( "#main:gt(0)" ).css( "right", now );     }     }); }); </script>

[]`s,
Josano
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17513
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Carregar html via Jquery

19-03-2011 20:15

Seria mais ou menos isso?

<style> div { position:absolute; } </style>


<script src="http://code.jquery.com/jquery-1.5.js"></script> <script> $(".anima").click(function(){ $(".bloco").animate({"left": "+=50px"}, "slow"); $(".bloco").animate({"left": "-=50px"}, "slow"); }); </script>


<a href="teste2.html" class="anima" target="iframe">link1</a> <a href="teste3.html" class="anima" target="iframe">link2</a>   <div class="bloco"><iframe src="teste2.html" name="iframe"></iframe></div>

0
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado