Jump to content

jonathanrn

Members
  • Content count

    41
  • Joined

  • Last visited

  • Days Won

    1

Posts posted by jonathanrn


  1. 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.


  2. Não entendi, você já deu sua resposta... Setinterval

    Eu recomendaria usar setTimeout ao invés de setInterval porque ambos são assíncronos. Melhor criar um intervalo usando setTimeout para executar um de cada vez (e reservar o identificador do mesmo timeout vai ser útil quando você quiser cancelar o mesmo com clearTimeout):

    var lastSlideTimeout, $img;
    
    $img = $(".right-block div .thumbs-list li a img");
    
    lastSlideTimeout = setTimeout(slide, 300);
    
    function slide() {
    	$img.next();
    	lastSlideTimeout = setTimeout(slide, 300);
    }
    

    Olá pessoal, primeiramente obrigado por responder. Então Sexy Yune dessa forma $img.next(); vai navegar para a próxima imagem de acordo com esse HTML sempre que a função repetir de acordo com time? Eu não consigo imaginar como ela vai reconhecer o primeiro .right-block div .thumbs-list li a img sem a ação click()


  3. Bom dia,

    Tenho um plugin Wordpress com essa estrutura em HTML, a imagem dentro de .image-block fica ao lado esquerdo em um tamanho grande e as imagens dentro de .right-block são outras imagens em miniatura que ao serem clicadas vai para .image-block do lado esquerdo, até ai tudo bem, mas agora essas imagens tem que ser alteradas sozinhas, pensei em um clique automático. Essa seria a melhor forma? caso for pode me auxiliar por favor?

    <div class="popup-wrapper popup-wrapper_3" style="overflow-y: auto;">
    
    	<div class="image-block_3 image-block ">
    				
    		<img alt="TITULO" id="wd-cl-img1" src="http://www.iranprogrammers.ir/file/pic/user/14.jpg">
    							
    	</div>
    
    	<div class="right-block">
    
    	      <h3 class="title">TITULO</h3>
    			
    	      <div>
    
    	            <ul class="thumbs-list thumbs-list_3">
    
    							
    									
    			<li class="active">
    									
    				<a href="" class="img-thumb" title="">
                                         <img src="http://s1-media.maxyart.com/media/users/rangga_effendi/66b846840965605b35c1ee4bdf824cbd.png">
                                    </a>
    									
    			</li>
    
    									
    			<li>									
    
    				<a href="" class="img-thumb" title="">
                                              <img src="http://s1-media.maxyart.com/media/users/rangga_effendi/66b846840965605b35c1ee4bdf824cbd.png">
                                    </a>
    									
    			</li>
    
    									
    			<li>
    									
    				<a href="" class="img-thumb" title="">
                                        <img src="http://s1-media.maxyart.com/media/users/rangga_effendi/66b846840965605b35c1ee4bdf824cbd.png">
                                    </a>
    												
    			</li>
    
    									
    		</ul>
    
    	</div>
    
    
    	</div>
    
    				
    
    </div>
    
    

    Não conheço muito bem jquery, no máximo faço algumas navegações pelo DOM ao clicar... Mas disparar automaticamente como seria? :huh:

    setInterval(slide,3000);
    
    function slide() {
    	$(".right-block div .thumbs-list li a img").next();
    }
    

  4. Bom dia a todos,

    Estou com dificuldade de executar um sisteminha de tradução em PHP na Godaddy, coisa que funcionava no localhost usando xampp. Quando clico no link para mudar a tradução a url trava no http:\DOMINIO/change_en.php não estou conseguindo fazer o redirecionamento com o header('Location: ' . $back); na Godaddy não sei porque, alguem ja passou por isso?


    Código do arquivo change_en.php que fica na pasta raiz no mesmo nivel que o index.php

    <?php 
    
    	$expire=time()+60*60*24*30;
    	setcookie("lang", "en", $expire);
    	$back = $_SERVER['HTTP_REFERER'];
    	header('Location: ' . $back);
    
    ?>
    

  5. Olá, tudo bem?

    Então, sou leigo em jquery mas estou tentando aprender e executar exercícios como por exemplo esse que eu empaquei -_-

    Queria que ao clicar novamente no '.menu-section-title' ele fechasse mas não estou conseguindo colocar isso no código, meio que uma condição quando for clicado novamente no mesmo titulo ele executasse o .hide()

    Segue exemplo de onde eu consegui executar sem problemas mas não fecha quando abre outro: https://jsfiddle.net/jonathanrn/7qfno505/2/

    Exemplo inacabado, quando clica no mesmo da errado (o importante é tentar haha): https://jsfiddle.net/jonathanrn/xd672cch/3/

    Desde já agradeço, vlw


  6. E aí galera, tudo bem?

     

    Estou em busca de um curso online de preferencia até mesmo do iMasters, meu objetivo é aprender a criar por exemplo um básico sistema de cadastro, login e renovação de senha por e-mail juntamente com o MySQL onde eu possa também trabalhar nas áreas restritas de cada conta, onde cada usuário cadastrado pode por exemplo deixar seu próprio texto e imagem salvas.

     

    Obs.: Tenho experiencia front-end (html, css, jquery). Na parte de PHP sei usar apenas a função MAIL para botar um form html para funcionar.

     

    Tendo em vista o meu objetivo e no que já tenho experiencia, quais cursos vocês me indicam e porque? :)


  7. Boa tarde galera,

     

    Estou com um problema no qual não imagino como resolver, problema:

     

    - 20 opções, cada uma dela tem um <input type="number">.

     

    - Selecionar 5 opções (com números de 1 a 5), sendo que 5 é o melhor.

     

    - depois de 5 opções numeradas desabilitar as outras 15 opções.

     

    Então, minha dúvida é como concatenar as opções que estão em texto que no caso estão dentro de uma div com o numero escolhido?

     

    Ou é melhor eu fazer um checkbox antes com jquery que quando ativado abra a opção de número? (Essa e minha opção na qual vai funcionar, mas fica diferente da qual eu queria)

     

    Resumindo busco uma opção que tenha apenas a discrição e uma caixa de numero ao lado, mas quero saber como cada numero escolhido na hora de envio no PHP vai ser identificado pela opção.


  8. if(empty($emaildestinatario) || empty($telefone) || empty($celular))
    {
    	 echo "<script>alert('Janela de Alerta.');</script>";
    	 header('location: PAGINA QUE VOCÊ QR SER DIRECIONADO');
         exit();
    }
    else
    {      
        $envio = mail($emaildestinatario, $assunto, $mensagemHTML, $headers);
    }
    

    Tenta esse ai :)

     

     

    Entendi, mas eu criei uma breve animação com keyframe (css3) antes do formulário, a animação e o formulario estão dentro do documento index.html ou seja não posso colocar header('location: index.htnl'); se não a animação vai reiniciar e só depois vai voltar para o formulário. Talvez tenha como apenas mudar a cor do INPUT via php caso a condição IF aconteça? ou isso também possa ocasionar o redirecionamento?


  9. Boa tarde galera,

     

    Então, meu formulario quando não é preenchido mostra uma caixa de alerta, até ai ta ok mas logo quando abre a caixa de alerta o index é redirecionado para o arquivo php onde lógico fica em branco. Enfim quero que a caixa continue aparecendo caso os capos estejão vazios, mas sem o redirecionamento. Segue o código:

    if(empty($emaildestinatario) || empty($telefone) || empty($celular))
    {
    	 echo "<script>alert('Janela de Alerta.');</script>";
         exit();
    }
    else
    {      
        $envio = mail($emaildestinatario, $assunto, $mensagemHTML, $headers);
    }
    

  10. Opa, tudo bem?

     

    Acabei resolvendo usando:

    $multiplo .= implode(' - ',$_POST["multiplo"]); 

    Mas aprendi que também posso usar:

    foreach($_POST["multiplo"] as $multiplo)
    {
    $mensagem .= " - ". $multiplo." \n";
    } 
    

    No caso, qual a diferença entre um e outro?


  11. Boa tarde galera,

     

    Tenho esse código em PHP, mas quando marco varias opções apenas uma é enviada por email. Como armazenar varias opções do Checkbox?

     

    Desde já agradeço. :D

    <?php
    
    $nomeremetente     = $_POST['nome'];
    $multiplo			= $_POST['multiplo'];
    $multiplo2			= $_POST['multiplo2'];
    $emailremetente    = trim($_POST['email']);
    $emaildestinatario = 'teste@teste.com.br'; // Digite seu e-mail aqui, lembrando que o e-mail deve estar em seu servidor web
    $telefone      	   = $_POST['telefone'];
    
     
     
    
    
    $mensagemHTML = '<strong>Formulário de Contato</strong>
    <p><b>Nome:</b> '.$nomeremetente.'</p>
    <p><b>multiplos checkbox:</b> '.$multiplo.'</p>
    <p><b>multiplos checkbox2:</b> '.$multiplo2.'</p>
    
    <hr>
    
    <p><b>E-Mail:</b> '.$emailremetente.'
    <p><b>Telefone:</b> '.$telefone.'
    
    ';
    
    
    // O remetente deve ser um e-mail do seu domínio conforme determina a RFC 822.
    // O return-path deve ser ser o mesmo e-mail do remetente.
    $headers = "MIME-Version: 1.1\r\n";
    $headers .= "Content-type: text/html; charset=utf-8\r\n";
    $headers .= "From: $emailremetente\r\n"; // remetente
    $headers .= "Return-Path: $emaildestinatario \r\n"; // return-path
    $envio = mail($emaildestinatario, $assunto, $mensagemHTML, $headers);
     
     if($envio)
    echo "<script>location.href='sucesso.html'</script>"; // Página que será redirecionada
    
    ?>
    
    <form action="envia.php" name="envia" id="envia" method="post">
    
    <div>
    
    <input type="checkbox" name="multiplo" value="01"> 01<br>
    
    <input type="checkbox" name="multiplo" value="02"> 02<br>
    
    <input type="checkbox" name="multiplo" value="03"> 03<br>
    
    <input type="checkbox" name="multiplo" value="04"> 04
    
    </div>
    
    <div>
    
    <input type="checkbox" name="multiplo2" value="01"> 01<br>
    
    <input type="checkbox" name="multiplo2" value="02"> 02<br>
    
    <input type="checkbox" name="multiplo2" value="03"> 03<br>
    
    <input type="checkbox" name="multiplo2" value="04"> 04
    
    </div>
    
    </form>
    

  12. Boa noite,

     

    Alguém que entenda de Jquery pode me responder se neste exemplo jsfiddle.net/jonathanrn/dc0o8rwy/3/ quando eu clicar na classe .BOTAO ele abrir apenas a próximo classe .TEXTO? Quero algo assim considerando que existem mais ou menos 50 classes .BOTAO e dar um nome diferente para cada uma delas parece ser algo 'ERRADO', creio que se houver uma forma de fazer com que cada classe .Botao quando for clicada procure a proxima classe .Texto seja melhor para o código.

     

    Desde já agradeço, vlw :)


  13. <div class="container">
       <img name="vermelha" src="#">
       <img name="vermelha" src="#">
       <img name="vermelha" src="#">
       <img name="vermelha" src="#">
       <img name="vermelha" src="#">
    
       <img name="azul" src="#">
    </div>
    

    Consegui, usando essa estrutura html fica mais ou menos assim:

     

    1 - Deixei o tamanho da div pai no mesmo tamanho da imagem azul;

    2 - Passei a imagem azul para cima das vermelhas;

    3 - Com absolute nas imagens vermelhas usei top e left para alocar em suas posições;

     

    -- já consegui o que queria --

     

    4 - Usei animation para depois de alguns segundos as imagens vermelhas voltarem para baixo da imagem azul (top: 0; left:0) .

     

    Assim que terminar posto o código!

    • +1 1

  14. Jonathanrn, evite o uso de animation para efeitos simples (consome mais código, é mais lento e pode dar problemas ao efetuar o efeito "out") e também evite margin-top para alinhamento (isso dará dores de cabeça mais pra frente). Quando você atribui um position: fixed; você pode utilizar o top: 50%; para que o menu fique ao centro da página.

    Muito bom!

    Verdade, acabei percebendo que não utilizo muito transition o que faz meu projeto ficar maior em certos casos. Vou me atentar, obrigado pela ajuda!

    • +1 1

  15. Boa esta função promise(), mas eu mudei um pouco o código rsrs. Na segunda página onde tenho 18 imagens utilizei css3 keyframes para fazer o fadeIn, só que no css não tem como eu determinar que é para cada imagem começar a transição 'uma após a outra'. Tem como o Jquery dar uma força nessa parte de 'um de cada vez'?

×

Important Information

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