Ir para conteúdo

Arquivado

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

EHCampos

Carregar carousel div

Por , em Javascript

Recommended Posts

EHCampos    0

EHCampos
Postado

Eu criei um carrosel de imagens, na hora de testar com os script dentro da pagina basc.html ( pagina aonde encontra tabela com as imagens) deu certo, mostrava 4 imagens e trocava conforme apertava next e prev

 

Mas na hora q carrego a pagina basc.html dentro da div #corpo_conteudo q esta na pagina index.php o carrosel não funciona mais aparesse todas as imagens na tela

 

Index.php

<head>

   <title>Efeito Carrossel com Jquery</title>
   <!-- inclusão do javascript-->
   <script type="text/javascript" src="js/jquery/jquery-1.4.2.min.js"></script>
   <script type="text/javascript" src="js/jcarousellite_1.0.1.min.js"></script>
   <script type="text/javascript" src="js/carrossel.js"></script>
   
      <!-- inclusão do CSS-->
      <link href="css/estilo.css" rel="stylesheet" type="text/css" />

</head>

<body>
<a href="#" onclick="abrirPag('12/teste.html');"><img src="imagens/esc.png" width="100" height="100" border="0" /></a>

<div id="corpo_conteudo">
    

</div>
</body>

basc.html

<body>
<script type="text/javascript">

$(function(){
      $("#carrossel").jCarouselLite({
            btnPrev : '.prev',
            btnNext : '.next',
            speed   : 2000,
            visible : 4
      })
})

</script>
<div id="carrossel">
            <ul>
     <li><a href="basc/images/32.jpg" rel="lightbox[plants]" title="Cód. 32" ><img src="basc/thumbnails/32.jpg" alt="32" width="160" height="120" border="0" /></a></li>
  <li><a href="basc/images/35.jpg" rel="lightbox[plants]" title="Cód. 35"><img src="basc/thumbnails/35.jpg" alt="32" width="160" height="120" border="0"/></a></li>
    <li><a href="basc/images/32.jpg" rel="lightbox[plants]" title="Cód. 32" ><img src="basc/thumbnails/32.jpg" alt="32" width="160" height="120" border="0" /></a></li>
  <li><a href="basc/images/35.jpg" rel="lightbox[plants]" title="Cód. 35"><img src="basc/thumbnails/35.jpg" alt="32" width="160" height="120" border="0"/></a></li>
    <li><a href="basc/images/32.jpg" rel="lightbox[plants]" title="Cód. 32" ><img src="basc/thumbnails/32.jpg" alt="32" width="160" height="120" border="0" /></a></li>
  <li><a href="basc/images/35.jpg" rel="lightbox[plants]" title="Cód. 35"><img src="basc/thumbnails/35.jpg" alt="32" width="160" height="120" border="0"/></a></li>
            </ul>
      </div>
      
      <p>
         <a href="#" class="prev">Anterior</a>
         <a href="#" class="next">Próximo</a>
      </p>
</body>

carrosel.js
[code]

$(function(){
      $("#carrossel").jCarouselLite({
            btnPrev : '.prev',
            btnNext : '.next',
            speed   : 2000,
            visible : 4
      })
})

[/code]

estilo.css
[code]
*{
margin:0;
padding:0;
}

#carrossel{
   width:750px;
   height:250px;
   overflow:hidden;
   margin:0 auto;
}

#carrossel ul{
   list-style:none;
}
#carrossel ul li{
   float:left;
   display:inline;
}

p{
   text-align:center;
}

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

scripts carregados por AJAX realmente não funcionam.

 

Já vi muitos tentando fazer isso, aqui algumas dicas que podem te ajudar, mas não garanto que vá resolver:

-> Não traga script na página que vai vir via AJAX (já deixe tudo na que está previamente carregada)

-> se precisar atrelar eventos dinamicamente, use o método: live()

 

veja:

http://forum.imasters.com.br/index.php?/topic/264642-executar-funcoes-js-em-paginas-carregadas-com-ajax/

Compartilhar este post

Link para o post
Compartilhar em outros sites

EHCampos    0

EHCampos
Postado

scripts carregados por AJAX realmente não funcionam.

 

Já vi muitos tentando fazer isso, aqui algumas dicas que podem te ajudar, mas não garanto que vá resolver:

-> Não traga script na página que vai vir via AJAX (já deixe tudo na que está previamente carregada)

-> se precisar atrelar eventos dinamicamente, use o método: live()

 

veja:

http://forum.imasters.com.br/index.php?/topic/264642-executar-funcoes-js-em-paginas-carregadas-com-ajax/

 

Eu tenho uma galeria de imagem jcarousel funcinando 100% qd esta na sua pagina basc.html

 

Oq eu quero e carregar a pagina basc.html dentro de uma div na pagina index.

 

Mais q fasso isso os jcarousel para de funcionar.

Ja coloquei esses script na pagina inicial mais não funciona

Compartilhar este post

Link para o post
Compartilhar em outros sites

EHCampos    0

EHCampos
Postado

Criei uma pajiga com lightbox e jcarouse abrin pelo link da pagina funciona tudo certo. Mas qd chamo essa pagina com um onclick para dentro de uma outra pagina para de funcionar

 

basc.html (lightbox + jcarouse

<!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=utf-8" />
<title>Untitled Document</title>

</head>

<body>

<div id="corpo_meio">
	<div id="corpo_conteudo">
<div id="carrossel">
            <ul>
     <li ><a href="basc/images/32.jpg" rel="lightbox-tour" title="Cód. 32" ><img src="basc/thumbnails/32.jpg" alt="32" onMouseOver="aumenta(this)" width="152" height="100" hspace="10" vspace="10" border="0" /></a></li>
  <li><a href="basc/images/35.jpg" rel="lightbox-tour" title="Cód. 35"><img src="basc/thumbnails/35.jpg" alt="32" onMouseOver="aumenta(this)" width="152" height="100" border="0"/></a></li>
    <li><a href="basc/images/32.jpg" rel="lightbox-tour" title="Cód. 32" ><img src="basc/thumbnails/32.jpg" alt="32" width="152" height="100" border="0" /></a></li>
  <li><a href="basc/images/35.jpg" rel="lightbox-tour" title="Cód. 35"><img src="basc/thumbnails/35.jpg" alt="32" width="152" height="100" border="0"/></a></li>
    <li><a href="basc/images/32.jpg" rel="lightbox-tour" title="Cód. 32" ><img src="basc/thumbnails/32.jpg" alt="32" width="152" height="100" border="0" /></a></li>
  <li><a href="basc/images/35.jpg" rel="lightbox-tour" title="Cód. 35"><img src="basc/thumbnails/35.jpg" alt="32" width="152" height="100" border="0"/></a></li>
  </ul>
      </div>
      </div>
      </div>


      
      <p>
         <a href="#" class="prev">Anterior</a>
         <a href="#" class="next">Próximo</a>
      </p>

</body>
</html>

 

Index.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=utf-8" />
<title>serralheria Campos</title>

<script type="text/javascript" src="js/jquery/jquery-1.4.2.min.js"></script>
<script language="javascript" src="js/ajax.js"></script>  
<script language="javascript" src="js/instrucao.js"></script>
<script type="text/javascript" src="js/jcarousellite_1.0.1.min.js"></script>
<script type="text/javascript" src="js/carrossel.js"></script>
<script type="text/javascript" src="js/jquery.lightbox.min.js"></script>


<style type="text/css" media="all">
<!--
@import url("css/fundo.css");
@import url("css/botao.css");
@import url("css/topo.css");
@import url("css/estilo.css");


body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: #c8c8c8;
}
-->
</style>
</head>

<body>
<div id="fundo">
<div id="basc" style="margin-top:5px; margin-left:10%"><a href="#" onclick="abrirPag('basc.html');"><img src="imagens/basc.png" width="110" height="110" border="0" /></a></div>


<div id="corpo_meio">
	<div id="corpo_conteudo">
    </div>
</div>


</div>


</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Javascript carregado com AJAX não funciona.

 

-> deixe todos os script necessários na página já previamente carregada

-> procure não duplicar tags unicas como <html>,<body>,<head>..

-> atente ao nivel de pastas

 

e mesmo assim, pode ser que nada disso resolva.

dê uma olhada:

http://forum.imasters.com.br/index.php?/topic/165277-ajax-executando-scripts-dentro-de-uma-pagina-carregada-com-ajax/

http://forum.imasters.com.br/index.php?/topic/264642-executar-funcoes-js-em-paginas-carregadas-com-ajax/

 

Tópicos Unidos. Não duplique a mesma dúvida pelo fórum.

Regras iMasters

http://forum.imasters.com.br/index.php?app=core&module=help

Compartilhar este post

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

Informação importante

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

  Aceito