Jump to content
jonathanrn

Jquery cycle e ajax

Recommended Posts

Olá pessoal, estou tendo problemas com o jquery cycle depois que chamo outro slide via ajax no lugar do primeiro. Vou explicar melhor e colocar uma imagem.
Preciso fazer isso:

apagar.jpg.950d0538e05b9a41831bc20db67f2759.jpg

O slide 1 já está no index, quando clico no slide 2 ou 3 ele chama seu outro respectivo slide via ajax:

<script type="text/javascript">
	$(document).ready(function(){
		$(".jsEscolha a").click(function( e ){
			e.preventDefault();
			var href = $( this ).attr('href');
			$("#trocaSlideJS").load( href +"#trocaSlideJS");
		});
	});
</script>

 

Jquery Cycle:

<script type="text/javascript">
	$(document).ready(function(){
	//CONF SLIDE
		$('#imagens ul').cycle({
			fx: 'fade',
			speed: 2000,
			timeout: 5000,
			next: '#prox',
			prev: '#ant',
			pager: '#pager'
		});
	});
</script>


HTML: 

<h1>INDEX SEM REFRSH</h1>


					<div id="imagens">
 						<div id="trocaSlideJS">
 							<ul>
                            	<li>
                                	<img src="https://s-media-cache-ak0.pinimg.com/originals/c5/53/7d/c5537d0e8aa31d595a612aae578d2e06.jpg" alt="imagem01" title="imagem01" width="600" height="300" />
                            	</li>
                     
                            	<li>
                                	<img src="http://4.bp.blogspot.com/-J-v5eIxTkwU/UN4sUKWetyI/AAAAAAAAAOk/03TWVVn0iSY/s1600/WallPaper-HD-3160.jpg" alt="imagem02" title="imagem02" width="600" height="300" />
                            	</li>
                     
                            	<li>
                                	<img src="http://cdn.pcwallart.com/images/california-palm-trees-tumblr-background-wallpaper-2.jpg" alt="imagem03" title="imagem03" width="600" height="300" />
                     
                            	</li>
                     
                        	</ul>
 
                        	<div class="pag">
                            	<a href="#" id="ant">anterior</a>
                            	<span id="pager"></span>
                            	<a href="#" id="prox">próximo</a>
                        	</div>
						</div>
                    </div>
                    
                    <div class="jsEscolha">
                    	<button><a href="index.html">slide01</a></button>
                    	<button><a href="slides/slide2.html">slide02</a></button>
                    	<button><a link="slide03.html">slide03</a></button>
                    </div>

 

Quando clico no slide 2 , o ajax chama a id="trocaSlideJS" do slide 2  mas o cycle para de funcionar.

 

O console não mostra muita coisa. Vou deixar o arquivo aqui pra quem quiser se aprofundar: slides.zip

 

Por que não está funcionando? Dês de já agradeço.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By infonet
      Olá pessoal,
      Poderiam me ajudar?
      Preciso enviar o formulário via ajax, porém preciso pegar todos os valor de todos os inputs e excluir o valor de cada linha em três tabela.
      Pode ser que alguma tabela não tenha nenhum valor, mas tem tabela que pode ter 10 valores.
       
      Tentei fazer como estou enviando, mas não consegui...
      Obrigado!
       

      <form name='formResiduo'> <?php $sqlr_end = "SELECT e.idclie FROM tb_end e WHERE NOT EXISTS(SELECT i.idinc FROM tb_inc i WHERE e.idclie = i.idinc) ORDER BY e.idclie ASC"; $querye = $conn->query($sqlr_end); $linhas = $querye->num_rows; while($rowrend = $querye->fetch_assoc()) { $reidclie = $rowrend["idclie"]; if ($linhas == "0") { $linhase = ""; } else { $linhase = $linhas; } ?> <input type='text' name='valor[]' value='<?php echo $reidclie; ?>'> <?php } ?> <?php if ($linhase) { ?> <div class='emCursorD emBlkA' style='position:relative;font-size:14px;font-weight:300;'> <div style='position:absolute;width:calc(100% + 100px);height:100%;left:-10px;'></div> <div class='formImptG' style='border-radius:3px;padding:5px;margin-bottom:20px;'> <label> <div style='position:relative;border-bottom:1px solid #606060;padding-top:10px;margint-top:5px;'><?php echo $linhase; ?></div> </label> </div> </div> <?php } ?> <?php $sqlr_res = "SELECT r.idclir FROM tb_res r WHERE NOT EXISTS(SELECT i.idinc FROM tb_inc i WHERE r.idclir = i.idinc) ORDER BY r.idclir ASC"; $queryr = $conn->query($sqlr_res); $linhas = $queryr->num_rows; while($rowrres = $queryr->fetch_assoc()) { $rridclir = $rowrres["idclir"]; if ($linhas == "0") { $linhasr = ""; } else { $linhasr = $linhas; } ?> <input type='text' name='valor[]' value='<?php echo $rridclir; ?>'> <?php } ?> <?php if ($linhasr) { ?> <div class='emCursorD emBlkA' style='position:relative;font-size:14px;font-weight:300;'> <div style='position:absolute;width:calc(100% + 100px);height:100%;left:-10px;'></div> <div class='formImptG' style='border-radius:3px;padding:5px;margin-bottom:20px;'> <label> <div style='position:relative;border-bottom:1px solid #606060;padding-top:10px;margint-top:5px;'><?php echo $linhasr; ?></div> </label> </div> </div> <?php } ?> <?php $sqlr_his = "SELECT h.idclih FROM tb_his h WHERE NOT EXISTS(SELECT i.idinc FROM tb_inc i WHERE h.idclih = i.idinc) ORDER BY h.idclih ASC"; $queryh = $conn->query($sqlr_his); $linhas = $queryh->num_rows; while($rowrhis = $queryh->fetch_assoc()) { $rhidclih = $rowrres["idclih"]; if ($linhas == "0") { $linhash = ""; } else { $linhash = $linhas; } ?> <input type='text' name='valor[]' value='<?php echo $rhidclih; ?>'> <?php } ?> <?php if ($linhash) { ?> <div class='emCursorD emBlkA' style='position:relative;font-size:14px;font-weight:300;'> <div style='position:absolute;width:calc(100% + 100px);height:100%;left:-10px;'></div> <div class='formImptG' style='border-radius:3px;padding:5px;margin-bottom:20px;'> <label> <div style='position:relative;border-bottom:1px solid #606060;padding-top:10px;margint-top:5px;'><?php echo $linhash; ?></div> </label> </div> </div> <?php } ?> </form> <div class='passar emLineB emCursorP'>Passar</div> <script> $(document).ready(function() { $('.passar').click(function(passar) {     var formdata = new FormData($("form[name='formResiduo']")[0]);     var link = 'sys/incClient.php?teste=ex';      $.ajax({         dataType: 'json',         type: 'POST',         url: link,         data: formdata,         processData: false,         contentType: false,     success: function (result) {         var data = result.split('|');         var rA = data[0];         var rB = data[1];     if(rA == "sucesso") {     alert(rB);     }      return false;     }     }); }); }); </script>
       

      if($_GET['teste']=="ex") {     foreach($_POST['valor'] AS $lines) {          $sqlr = @mysqli_query($conn, "DELETE FROM tb_res WHERE idclir = '$lines'");     $sqle = @mysqli_query($conn, "DELETE FROM tb_end WHERE idclie = '$lines'");     $sqlh = @mysqli_query($conn, "DELETE FROM tb_his WHERE idclih = '$lines'");     }          $arrch = "sucesso"."|".$lines;     echo json_encode($arrch);     exit; }
    • By fabioamorais
      Ola pessoal, sou novo aqui no fórum e também no mundo da programação. 

      Estou criando um sistema de cadastro de clientes em PHP 7 e mysql
      para meu serviço para fins de organização, tenho ja pronto o sistema de cadastro e edição do cliente, tenho login por usuário e senha.
      preciso colocar nesse sistema uma forma que registre a ação e o usuário que fez a ação quando houver uma alteração no cadastro.
      exemplo;
      O usuario (jose) alterou o status de analise para concluído .
      o usuario (pedro) alterou a localização de mesa para armario.
      e que fosse exibido como um tipo de histórico de eventos no próprio cadastro do cliente.
      e nesse campo se ainda tiver como add cometários.
      Usuario (jose): Precisa entrar em contato com o cliente francisco. 
      Usuario (pedro): cliente foi avisado e está sabendo.
       
      quem souber uma forma de fazer isso, ficaria muito grato.

    • By Webster Moitinho
      Implementei em meu site o JQuery Autocomplete e consegui fazer ele funcionar na boa. Porém não estou conseguindo fazer com que, quando o usuário pesquisar pelo termo, e selecionar na lista, ele seja direcionado para a respectiva página.
       
      Meu código está assim:
      <div id="pesquisa"> <form action="index.php?id=<?php echo $target; ?>&tp=smp" method="post" name="autocomplete" target="_self"> <strong>Pesquisa:</strong> <input id="autocomplete" title="Digite algo" placeholder="&nbsp;&nbsp;&nbsp;&nbsp;Digite algo"> <button id="button-icon">Pesquise</button> </form> </div><!--pesquisa--> <script src="libraries/jquery.js"></script> <script src="libraries/jquery-ui.js"></script> <script> <?php $sql = "SELECT pags.id, pags.title, pags.keywords, pags.tema FROM pags WHERE vendavel = 'S' ORDER BY pags.id"; $resultado = $PDO->query( $sql ); $rows = $resultado->fetchAll(PDO::FETCH_ASSOC); ?> var availableTags = [ <?php foreach ($rows as $key => $linha) { $target = $linha['id']; echo '"' . $linha['title'] .' | ' . $linha['keywords'] . '",'; } ?> "" ]; $( "#autocomplete" ).autocomplete({ source: availableTags }); $( "#button" ).button(); $( "#button-icon" ).button({ icon: "ui-icon-gear", showLabel: false }); </script>  
    • By skti
      Boa tarde, me chamo Augusto e gostaria de saber como preencher o campo automaticamente seguindo o formato descrito no título.. por exemplo, ao digitar os 3 primeiros números do cpf, o '.' (ponto) ser preenchido automaticamente. Sou iniciante e o mais perto que cheguei foi criar um input que, quando são digitados 3 caracteres, apareça um '-' (hífen), ficando xxx- por exemplo, porém, de maneira incorreta pois ao continuar digitando o texto ficava xxxxxx- ao inves de xxx-xxx e assim por diante. Agradeço quem puder ajudar! :)
    • By s3c0
      Boa tarde galera,
       
      estou precisando que a barra superior acompanhe o Scroll. Está funcionando de acordo com o propósito, porém se der um Refresh no meio da página por exemplo, a barra superior não aparece.
       
      $("document").ready(function($){ $(window).scroll(function () { if ($(this).scrollTop() > 68) { $('.topo').fadeIn(); $('.topo').css("position","fixed") $('.topo').css("z-index","2") $('.topo').css("margin-top","-68px") } else { $('.topo').css("position","absolute") $('.topo').css("z-index","1") $('.topo').css("z-index","2") $('.topo').css("margin-top","0px") } }); });  
      Alguém possui alguma ideia do que está errado?
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.