Ir para conteúdo
Fórum Script Brasil

Carlos Rocha

Membros
  • Total de itens

    1.300
  • Registro em

  • Última visita

Posts postados por Carlos Rocha

  1. Boas pessoal, estou encontrando dificuldades para achar uma adaptação ao meu código de slider.

    Tudo funciona bem. Mas quando eu tento reduzir o tamanho do browser, a UL do Slider continuar com a mesma medida porque estou resgatando ela via JS.

    Preciso de ajuda para converter em CSS.

     

    CSS:

    
    @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');
    * {    
    	font-family: Montserrat;
    	margin: 0;
    	padding: 0;
    	border: none;
    	outline: none;
    	transition: all 1s ease;
    	-webkit-box-sizing: border-box;
    	-moz-box-sizing: border-box;
    	box-sizing: border-box;
    }
    :root {
    	--widthContainer: 80vw;
      }
      
      ul {
    	list-style: none;
      }
      
      div.slider {
    	  position: relative;
    	display: flex;
    	justify-content: center;
    	align-items: center;
    	width: 100vw;
    	background: #000;
      }
      
      div.slider div.container {
    	position: relative;
    	width: var(--widthContainer);
    	overflow: hidden;
      }
      
      div.slider div.container ul {
    	  position: relative;
    	display: inline-flex;
      }
      
      div.slider div.container ul li {
    	position: relative;
    	width: var(--widthContainer);
      }
      
      div.slider div.container ul li img{
    	width: 100%;
      }
      
      div.slider div.container label {
    	  position: absolute;
    	  opacity: 0;
    	  width: 100px;
    	  height: 50px;
    	  left: calc( 50% - 50px );
    	  top: calc( 50% - 25px );
    	  z-index:2;
    	  color: #fff;
      }
      
      div.slider div.container button {
    	  position: absolute;
    	  display: flex;
    	  align-items: center;
    	  justify-content: center;
    	  width: 50px;
    	  height: 50px;
    	  top: calc( 50% - 25px );
    	  background: none;
    	  border-radius: 50%;
    	  z-index:2;
    	  color: #fff;
    	  font-size: 2em;
      }  
      
      div.slider div.container button:hover {
    	  cursor: pointer;
    	  background: #999;
      }
      
      div.slider div.container button#back {
    	  left: 10px;
      }
      
      div.slider div.container button#front {
    	  right: 10px;
      }
      
      div.slider div.container ul li span {
    	  position: absolute;
    	  display: flex;
    	  font-size: 2.5vw;
    	  top: 0;
    	  left: 0;
    	  color: #fff;
    	  background: rgba(0,0,0, .3);
    	  padding: 10px;
    	  width: 100%;
      }		
      
      div.slider div.container ul li span:hover {
    	  background: #999;
    	  cursor:pointer;
      }
      
      .ulToRight {
    	  left: calc(left - var(--widthContainer) );
      }
      
      .ulToLeft {
    	  left: calc(left + var(--widthContainer));
      }
    
    @media screen and (min-width: 0px) and (max-width:800px) {
      :root {
    	--widthContainer: 100vw;
      }
    }

    HTML:

    <script
      src="https://code.jquery.com/jquery-3.5.1.min.js"
      integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
      crossorigin="anonymous"></script>
    
    <div class="slider">
      <div class="container">
        <label>Pausado</label>		
    	  <button id="back"><</button>
        <ul>
          <li class="item">
    			  <span>F540 2 BAN PNEU 1.1 X 1.80 R$ 25.800</span>
            <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.1 X 1.80 R$ 25.800.png">
          </li>
          <li class="item">
    			  <span>F540 2 BAN PNEU 1.1 X 1.60 R$ 24.300</span>
            <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.1 X 1.60 R$ 24.300.png">
          </li>
          <li class="item">
    			  <span>F540 2 BAN PNEU 1.1 X 2.00 R$ 27.300</span>
            <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.1 X 2.00 R$ 27.300.png">
          </li>
          <li class="item">
    			  <span>F540 2 BAN PNEU 1.3 X 2.00 R$ 28.800</span>
            <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.3 X 2.00 R$ 28.800.png">
          </li>
          <li class="item">
    			  <span>F540 2 BAN PNEU 1.5 X 2.00 R$ 30.300</span>
            <img src ="https://www.hotplateprensas.com.br/slider/slider/F540 2 BAN PNEU 1.5 X 2.00 R$ 30.300.png">
          </li>
        </ul>	   
    	  <button id="front">></button>
      </div>
     </div>

    JS:

    $(document).ready(function(){
    	  
    	container = $("div.slider div.container");
    	containerWidth = $(container).width();
    	ul = $("div.slider div.container ul");
    	left = $(ul).offset().left;
    	lis = $("div.slider div.container ul li");
    	label = $(container).find("label");
    	back = $(container).find("button#back");
    	front = $(container).find("button#front");	
    
    	back.on("click", function() {
    				
    		label.css("opacity", 0);
    				
    		//ul.addClass("ulToLeft").removeClass("ulToRight");
    
    		left += containerWidth;
    		
    		if ( Math.round(left) >= containerWidth ) {
    		   left = ( ( lis.length - 1 ) * -containerWidth ) + container.offset().left;
    		}
    		
    		ul.offset({left:Math.round(left)});	
    		
    	})
    
    	front.on("click", function() {
    		
    		label.css("opacity", 0);
    				
    		//ul.addClass("ulToRight").removeClass("ulToLeft");
    		
    		left -= containerWidth;
    		
    		if ( Math.round(left) <= -((lis.length - 1) * containerWidth) ) {
    		   left = container.offset().left;
    		}
    		
    		ul.offset({left:Math.round(left)});
    		
    	})
    
    	front.trigger( "click" );
    
    	function intervalo () {
    		front.trigger( "click" );
    	}
    
    	var interval = setInterval(intervalo,4000);
    
    	$(container).on("mouseover", function(){
    		clearInterval(interval);
    		label.css("opacity", 1);
    	}).mouseout(function(){	
    		label.css("opacity", 0);
    		interval = setInterval(intervalo,4000);
    	});
    	
    	
    })

    Pode ser testado em https://codepen.io/carcleo/pen/yLVOxMv

    O problema é que não encontrando uma forma de, ao reduzir manualmente o tamanho da janela (navegador),  fazer com que o tamanho da UL acompanhe os 80% da VW.

    Ele acaba mantendo os 80 da vw da primeira vez que a janela é aberta.

    Fiz uma tentativa com addClass do JQUERY mas não deu muito certo!

  2. Opa, obrigado.

    Mas veja isso!

    https://codepen.io/carcleo/pen/RwPGeMN

    O problema do efeito eu arrumei. Após ver a sua solução enxerguei detalhe que não estava conseguindo perceber;

    Mas, se puder perder mais uns minutinhos comigo...

    Existem 2 problemas finais agora que não consigo resolver!

    Quando ele chega no ponto de volta, embora ele volte corretamente agora, ele esta dando o prazo do timer que é 2 segundos e não deveria dar. Mas isso deve ser que preciso parar o timer nesse ponto.

    O outro problema esta nos botões!

    Quando clico, ele vai empurrando a UL (normal), mas acaba a UL e fica espaço em branco.

    Não acontece a mesma coisa que no automático!||

    Entendendo esses 2 problema para mim acaba esse projeto!

    Segue novo código:

    CSS

    
    * {
    	margin: 0;
    	padding: 0;
    	border: none;
    }
    
    body {
    	display: flex;
    	width: 1000px;
    	margin: 0 auto;
    }
    
    ..no-transition {
    	transition: none !important;
    }
    .slider > * {	
    	border:0;
    	padding: 0;
    	margin: 0;
    	outline: 0;	
    	box-sizing: border-box;
    }
    .slider {
       position: relative;
       display: flex;
       flex-direction: column;
       width: 100%;
       height: 130px;
       border: 0;   
    }
    .slider > #slides {
       position: relative;
       display: flex;
       overflow: hidden;
    }
    .slider > #slides > #slidesHolder {
       position: relative;
       display: flex;
       transition: all 1s ease;
    }
    .slider > #slides > #slidesHolder > ul {
       position: relative;
       display: flex;
       list-style: none;
    }
    .slider > #slides > #slidesHolder > ul > li {
       position: relative;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 200px;
       height: 100px;
    }
    .slider > #slides > #slidesHolder > ul > li > a {
       position: relative;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 100%;
       height: 100%;
    }
    .slider > #slides > #slidesHolder > ul > li > a > img {
    	height: 100%;
    }
    .slider > #title {
    	position: absolute;
        align-items: center;
        justify-content: center;
    	display: none;
    	width: 100px;
    	height: 30px;
    	top: 50px;
    	right: calc(50% - 25px);
    	background: #999;
    	border: 1px solid #ccc;
    }
    .slider > #controles {
       display: flex;
       align-items: center;
       justify-content: center;	
       width: 100%;
       height: 30px;
    }
    
    .slider > #controles  > button {
       display: flex;
       align-items: center;
       justify-content: center;		
       width: 30px;
       height: 30px;
       cursor: pointer;
       margin: auto 5px;
       border-radius: 50%;
       opacity: .2;
    }
    
    .slider > #controles  > button:hover {
       opacity: 1;
       border: 1x solid #ccc;
    }

    HTML

    <div class="slider">
    
    	<div id="slides">
    
    		<div id="slidesHolder">
    
    			<ul>
    
    				<li><a href=''>1</a></li>
    
    				<li><a href=''>2</a></li>
    
    				<li><a href=''>3</a></li>
    
    				<li><a href=''>4</a></li>
    
    				<li><a href=''>5</a></li>
    
    				<li><a href=''>6</a></li>
    
    				<li><a href=''>7</a></li>
    			</ul>
    			
    		</div>
    	
    	</div>
    	
    	<span id="title">Pausado</span>
    	
    	<div id="controles">
    
    		<button id="back"> < </button>
    		<button id="next"> > </button>
    		
    	</div>
    
    </div>

    Javascript

    $(document).ready( function() {
    
    	//cria as variáveis modificáveis;
    	var numeroSlidesMostra =   4,
      		tempoIntervalo     =   2000,
    	  	caminho            =   0;
    		
    	//cria as variáveis NÃO modificáveis;
    	var container          =   $("div.slider"),
    		slides             =   $(container).find("#slides"),
    		slidesHolder       =   $(slides).find("#slidesHolder"),
    		slide              =   $(slidesHolder).find("ul"),
    		lis                =   $(slide).find("li"),
    		tamanhoLi          =   $(lis).first().outerWidth(),
    		numeroSlides       =   $(lis).length,
    		tamanhoUl          =   tamanhoLi * numeroSlides,
    		slideClone         =   $(slide).clone(),
    		controles          =   $(container).find("div#controles"),
    		span               =   $(container).find("span#title"),
    		btnVoltar          =   controles.find("button#back"),
    		btnAvancar         =   controles.find("button#next");
    
    	//determina a largura da div que abrigará as UL's.
    	$(slides).width(numeroSlidesMostra * tamanhoLi);
    	//determina a largura de cada UL partindo do produto entre a largura de cada LI e a quantidade de LI's
    	$(slide).width(tamanhoUl);
    	//determina a largura de cada UL clone partindo do produto entre a largura de cada LI e a quantidade de LI's
    	$(slideClone).width(tamanhoUl);
    	//cria uma cópia antes
    	$(slideClone).clone().prependTo($(slidesHolder));
    	//cria uma cópia depois
    	$(slideClone).clone().appendTo($(slidesHolder));
    	
    	function avancar () {	
    		
    		if (  $(slidesHolder).position().left <= -tamanhoUl )
    			$(slidesHolder).css ({"transition": "none", "left": 0});
    		else
    			$(slidesHolder).animate({
    				"left" : "-=" + tamanhoLi
    			}, 1000);			
    		
    	}
    
    
    	function voltar () {
    		
    		if (  $(slidesHolder).position().left >= tamanhoUl )
    			$(slidesHolder).css ({"transition": "none", "left": "-=" + tamanhoUl});
    		else
    			$(slidesHolder).animate({
    				"left" : "+=" + tamanhoLi
    			}, 1000);			
    		
    	}
    	
    	btnAvancar.click ( function () {
    
    		avancar();		
    		
    	});
    	
    	//código do onClick no botão voltar
    	btnVoltar.click ( function () {
    
    		voltar();		
    		
    	});
    
    	//dispara o loop na função avançar
    	var loop = setInterval( avancar, tempoIntervalo);		
    
    	//para e reinicia o loop ao passar/retirar o mouse sobre o slide
    	slides.mouseover(function(){
    		clearInterval(loop);
    		//mostra a mensagem 
    		span.css('display', 'flex');
    	}).mouseout(function(){
    		loop = setInterval( avancar, tempoIntervalo);	
    		//esconde a mensagem 
    		span.css('display', 'none');
    	});
    	
    })

     

  3. Tenho o slide abaixo que estou fazendo com Jquery, css e html e animate.

    O PROBLEMA:

    Quando, no Javascript, o script entrar no bloco abaixo

    if (  $(slidesHolder).position().left <= -tamanhoUl )

    A animação devera NÃO existir e a transição correr de forma abrupta, instantânea.

    No então, mesmo fazendo a velocidade igual a 0 o efeito ainda ocorre!

    Pergunta: O que não está certo?

    CSS:

    * {
    	border:0;
    	padding: 0;
    	margin: 0;
    	outline: 0;	
    	box-sizing: border-box;
    }
    body {
    	display:flex;
    	width: 1040px;	
    	margin: 0 auto;
    	justify-content: center;
    }
    .no-transition {
    	transition: none !important;
    }
    .slider > * {	
    	border:0;
    	padding: 0;
    	margin: 0;
    	outline: 0;	
    	box-sizing: border-box;
    }
    .slider {
       position: relative;
       display: flex;
       flex-direction: column;
       width: 100%;
       height: 130px;
       border: 0;   
    }
    .slider > #slides {
       position: relative;
       display: flex;
      /* overflow: hidden; */
    }
    .slider > #slides > #slidesHolder {
       position: relative;
       display: flex;
       transition: all 1s ease;
    }
    .slider > #slides > #slidesHolder > ul {
       position: relative;
       display: flex;
       list-style: none;
    }
    .slider > #slides > #slidesHolder > ul > li {
       position: relative;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 200px;
       height: 100px;
    }
    .slider > #slides > #slidesHolder > ul > li > a {
       position: relative;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 100%;
       height: 100%;
    }
    .slider > #slides > #slidesHolder > ul > li > a > img {
    	height: 100%;
    }
    .slider > #title {
    	position: absolute;
        align-items: center;
        justify-content: center;
    	display: none;
    	width: 100px;
    	height: 30px;
    	top: 50px;
    	right: calc(50% - 25px);
    	background: #999;
    	border: 1px solid #ccc;
    }
    .slider > #controles {
       display: flex;
       align-items: center;
       justify-content: center;	
       width: 100%;
       height: 30px;
    }
    
    .slider > #controles  > button {
       display: flex;
       align-items: center;
       justify-content: center;		
       width: 30px;
       height: 30px;
       cursor: pointer;
       margin: auto 5px;
       border-radius: 50%;
       opacity: .2;
    }
    
    .slider > #controles  > button:hover {
       opacity: 1;
       border: 1x solid #ccc;
    }

    HTML:

    <div class="slider">
    
    	<div id="slides">
    
    		<div id="slidesHolder">
    
    			<ul>
    
    				<li><a href=''><img src='img/sites/ctemcasb.png'></a></li>
    
    				<li><a href=''><img src='img/sites/fielcard.png'></a></li>
    
    				<li><a href=''><img src='img/sites/funerariasaopedro.png'></a></li>
    
    				<li><a href=''><img src='img/sites/gasmuriae.png'></a></li>
    
    				<li><a href=''><img src='img/sites/hotplateprensas.png'></a></li>
    
    				<li><a href=''><img src='img/sites/mariasvaidosas.png'></a></li>
    
    			</ul>
    			
    		</div>
    	
    	</div>
    	
    	<span id="title">Pausado</span>
    	
    	<div id="controles">
    
    		<button id="back"> < </button>
    		<button id="next"> > </button>
    		
    	</div>
    
    </div>
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

    Javascript

    $(document).ready( function() {
    
    	//cria as variáveis modificáveis;
    	var numeroSlidesMostra =   4,
    		tempoIntervalo     =   2000,
    		caminho            =   0;
    		
    	//cria as variáveis NÃO modificáveis;
    	var container          =   $("div.slider"),
    		slides             =   $(container).find("#slides"),
    		slidesHolder       =   $(slides).find("#slidesHolder"),
    		slide              =   $(slidesHolder).find("ul"),
    		lis                =   $(slide).find("li"),
    		tamanhoLi          =   $(lis).first().outerWidth(),
    		numeroSlides       =   $(lis).length,
    		tamanhoUl          =   tamanhoLi * numeroSlides,
    		slideClone         =   $(slide).clone(),
    		controles          =   $(container).find("div#controles"),
    		span               =   $(container).find("span#title"),
    		btnVoltar          =   controles.find("button#back"),
    		btnAvancar         =   controles.find("button#next");
    
    	//determina a largura da div que abrigará as UL's.
    	$(slides).width(numeroSlidesMostra * tamanhoLi);
    	//determina a largura de cada UL partindo do produto entre a largura de cada LI e a quantidade de LI's
    	$(slide).width(tamanhoUl);
    	//determina a largura de cada UL clone partindo do produto entre a largura de cada LI e a quantidade de LI's
    	$(slideClone).width(tamanhoUl);
    	//cria uma cópia antes
    	$(slideClone).clone().prependTo($(slidesHolder));
    	//cria uma cópia depois
    	$(slideClone).clone().appendTo($(slidesHolder));
    	
    	function avancar () {	
    		
    		if (  $(slidesHolder).position().left <= -tamanhoUl )
    			$(slidesHolder).animate({
    				"left" : 0
    			}, 0);		
    		else
    			$(slidesHolder).animate({
    				"left" : "-=" + tamanhoLi
    			}, 1000);			
    		
    	}
    
    
    	function voltar () {
    		
    		if (  $(slidesHolder).position().left >= tamanhoUl )	
    			$(slidesHolder).animate({
    				"left" : tamanhoUl
    			}, 0);
    		else
    			$(slidesHolder).animate({
    				"left" : "+=" + tamanhoLi
    			}, 1000);	
    		
    	}
    	
    	//código do onClick no botão avançar	
    	btnAvancar.click ( function () {
    
    		avancar();		
    		
    	});
    	
    	//código do onClick no botão voltar
    	btnVoltar.click ( function () {
    
    		voltar();		
    		
    	});
    
    	//dispara o loop na função avançar
    	var loop = setInterval( avancar, tempoIntervalo);		
    
    	//para e reinicia o loop ao passar/retirar o mouse sobre o slide
    	slides.mouseover(function(){
    		clearInterval(loop);
    		//mostra a mensagem 
    		span.css('display', 'flex');
    	}).mouseout(function(){
    		loop = setInterval( avancar, tempoIntervalo);	
    		//esconde a mensagem 
    		span.css('display', 'none');
    	});
    	
    })

     

  4. Oi, obrigado pelo retorno. Mas, o problema continua!

    Note que, no código que você postou no fiddle você não descomentou a linha

    //$(slidesHolder).find("ul").first().remove();

    Sendo assim, o código ainda cotinina gerando clones indefinidamente sem remover as que já passaram pelo container!

    Entendeu o drama?

    Quando você descomentar a linha que remove a UL, perceberá que os problemas começam!

    E só mais uma coisa: Se você fizer,

    container.mouseover(function(){

    Terá problemas para com os botoes pois o slider pausará.

    Mas perceba que, mesmo que tudo pareça estar indo bem, você verá que após algumas passagens, o slider se findará e n]ao mostrará mais nada pois a UL já estará distante para a esquerda ou para a direita conforme o sentido!

    E um ultimo problema, quando clica nos botões, apos o segundo ou terceiro cliques, perceberá que o slide se finda!

     

  5. Então, estou tentando criar um Slide Show personalizado!

    Mas a ideia é realmente entender o que estou fazendo. Por isso não estou usando soluções prontas tipo bottstrap entre outras!

    Tecnicamente, eu consegui.

    Estou fazendo assim:

    Tenho uma DIV que abriga 1 UL inicialmente.

    Logo após, eu crio um clone dessa UL e coloco no fim dessa DIV.

    Depois, eu quero remover a primeira UL 

    Mas quando removo começa a bagunçar e some tudo!

     

    Gostaria de uma ajuda para criar a logica da remoção de uma UL que não mais será usada!

     

    Segue o código:

    CSS

    * {
    	border:0;
    	padding: 0;
    	margin: 0;
    	outline: 0;	
    	box-sizing: border-box;
    }
    body {
    	display:flex;
    	width: 1040px;	
    	margin: 0 auto;
    	justify-content: center;
    }
    .slider > * {	
    	border:0;
    	padding: 0;
    	margin: 0;
    	outline: 0;	
    	box-sizing: border-box;
    }
    .slider {
       position: relative;
       display: flex;
       flex-direction: column;
       width: 100%;
       height: 130px;
       border: 0;   
    }
    .slider > #slides {
       position: relative;
       display: flex;
       overflow: hidden;
    }
    .slider > #slides > #slidesHolder {
       position: relative;
       display: flex;
       transition: all 1s ease;
    }
    .slider > #slides > #slidesHolder > ul {
       position: relative;
       display: flex;
       list-style: none;
    }
    .slider > #slides > #slidesHolder > ul > li {
       position: relative;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 200px;
       height: 100px;
    }
    .slider > #slides > #slidesHolder > ul > li > a {
       position: relative;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 100%;
       height: 100%;
    }
    .slider > #slides > #slidesHolder > ul > li > a > img {
    	height: 100%;
    }
    .slider > #title {
    	position: absolute;
        align-items: center;
        justify-content: center;
    	display: none;
    	width: 100px;
    	height: 30px;
    	top: 50px;
    	right: calc(50% - 25px);
    	background: #999;
    	border: 1px solid #ccc;
    }
    .slider > .controles {
       display: flex;
       align-items: center;
       justify-content: center;	
       width: 100%;
       height: 30px;
    }
    
    .slider > .controles  > button {
       display: flex;
       align-items: center;
       justify-content: center;		
       width: 30px;
       height: 30px;
       cursor: pointer;
       margin: auto 5px;
       border-radius: 50%;
       opacity: .2;
    }
    
    .slider > .controles  > button:hover {
       opacity: 1;
       border: 1x solid #ccc;
    }

    HTML

    <link type="text/css" rel="stylesheet" href="scripts/css/estilo.css"/>
    <link type="text/css" rel="stylesheet" href="scripts/css/slider.css"/>
    
    <div class="slider">
    
    	<div id="slides">
    
    		<div id="slidesHolder">
    
    			<ul>
    
    				<li><a href=''><img src='img/sites/ctemcasb.png'></a></li>
    
    				<li><a href=''><img src='img/sites/fielcard.png'></a></li>
    
    				<li><a href=''><img src='img/sites/funerariasaopedro.png'></a></li>
    
    				<li><a href=''><img src='img/sites/gasmuriae.png'></a></li>
    
    				<li><a href=''><img src='img/sites/hotplateprensas.png'></a></li>
    
    				<li><a href=''><img src='img/sites/mariasvaidosas.png'></a></li>
    
    			</ul>
    			
    		</div>
    	
    	</div>
    	
    	<span id="title">Pausado</span>
    	
    	<div class="controles">
    
    		<button id="back"> < </button>
    		<button id="next"> > </button>
    		
    	</div>
    
    </div>
    
    <script type="text/javascript" src="scripts/js/jquery.js"></script>
    <script type="text/javascript" src="scripts/js/slider.js"></script>

    JAVASCRIPT

    $(document).ready( function() {
    
    	//cria as variáveis modificáveis;
    	var numeroSlidesMostra =   4,
    		tempoIntervalo     =   2000,
    		caminho            =   0;
    		
    	//cria as variáveis NÃO modificáveis;
    	var container          =   $("div.slider"),
    		slides             =   $(container).find("#slides"),
    		slidesHolder       =   $(slides).find("#slidesHolder"),
    		slide              =   $(slidesHolder).find("ul"),
    		lis                =   $(slide).find("li"),
    		tamanhoLi          =   $(lis).first().outerWidth(),
    		numeroSlides       =   $(lis).length,
    		tamanhoUl          =   tamanhoLi * numeroSlides,
    		slideClone         =   $(slide).clone(),
    		controles          =   $(container).find("div.controles"),
    		span               =   $(container).find("span#title"),
    		btnVoltar          =   controles.find("button#back"),
    		btnAvancar         =   controles.find("button#next");
    
    	//determina a largura da div que abrigará as UL's.
    	$(slides).width(numeroSlidesMostra * tamanhoLi);
    	//determina a largura de cada UL partindo do produto entre a largura de cada LI e a quantidade de LI's
    	$(slide).width(tamanhoUl);
    	//determina a largura de cada UL clone partindo do produto entre a largura de cada LI e a quantidade de LI's
    	$(slideClone).width(tamanhoUl);
    
    	function avancar () {	
    		
    		//calcula o envio do slider para frente na largura de uma LI
    		caminho -= tamanhoLi;		
    		
    		//envia o slider para frente
    		$(slidesHolder).css("transform" , "translateX(" + caminho + "px)");
    		
    		//encontra a posição do slider no momento da função
    		let posicao = $(slidesHolder).position().left;
    		
    		//verifica se o slide já caminhou uma UL inteira
    		if ( posicao % tamanhoUl === 0) {
    			
    			//cria uma UL no final do slider
    			$(slideClone).clone().appendTo($(slidesHolder));
    			//exclui a primeira UL que não precisamos mais
    			//código comentado pois está removendo tudo
    			//$(slidesHolder).find("ul").first().remove();
    			
    		} 
    		
    	}
    
    
    	function voltar () {	
    		
    		//calcula o envio do slider para traz na largura de uma LI
    		caminho += tamanhoLi;		
    		
    		//envia o slider para traz
    		$(slidesHolder).css("transform" , "translateX(" + caminho + "px)");	
    		
    		//encontra a posição do slider no momento da função
    		let posicao = $(slidesHolder).position().left;
    		
    		//verifica se o slide já caminhou uma UL inteira		
    		if ( posicao % tamanhoUl === 0) {
    			
    			//cria uma UL no inicio do slider
    			$(slideClone).clone().prependTo($(slidesHolder));
    			//exclui a ultima UL que não precisamos mais
    			//código comentado pois está removendo tudo
    			//$(slidesHolder).find("ul").last().remove();
    			
    		} 			
    		
    		
    	}
    
    	//código do onClick no botão avancar
    	btnAvancar.click ( function () {
    
    		avancar();		
    		
    	});
    	
    	//código do onClick no botão voltar
    	btnVoltar.click ( function () {
    
    		voltar();		
    		
    	});
    
    	//dispara o loop na função avançar
    	var loop = setInterval( avancar, tempoIntervalo);		
    
    	//para e reinicia o loop ao passar/retirar o mouse sobre o slide
    	slides.mouseover(function(){
    		clearInterval(loop);
    		//mostra a mensagem 
    		span.css('display', 'flex');
    	}).mouseout(function(){
    		loop = setInterval(avancar,tempoIntervalo);
    		//esconde a mensagem 
    		span.css('display', 'none');
    	});
    	
    })

    Obrigado a quem puder me ajudar!

  6. Tenho um objeto 

     

    MediaPlayer mPlayer = new MediaPlayer();

     

    Objetivo: Tocar o Streaming de uma Web Rádio e funciona corretamente.

     

    Porém, quando clico em Play, leva um tempo até que a Rádio Web comece a tocar.

     

    Existe alguma forma de enquanto o streaming estiver carregando, eu pegar o percentual para passar para uma  SeekBar por exemplo?, 

     

    Como?

     

    Segue o que eu já fiz:

     

    package carcleo.com.player;
    
    import android.app.NotificationManager;
    import android.app.PendingIntent;
    import android.app.ProgressDialog;
    import android.app.TaskStackBuilder;
    import android.content.Context;
    import android.content.Intent;
    import android.media.AudioManager;
    import android.media.MediaPlayer;
    import android.media.MediaPlayer.OnBufferingUpdateListener;
    import android.os.AsyncTask;
    import android.os.Build;
    import android.support.annotation.RequiresApi;
    import android.support.v4.app.NotificationCompat;
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.util.Log;
    import android.view.View;
    import android.widget.Button;
    import android.widget.SeekBar;
    import android.widget.TextView;
    import java.io.IOException;
    
    public class player extends AppCompatActivity implements OnBufferingUpdateListener{
    
        private MediaPlayer mPlayer;
        private String URL;
        private Button btnPlayPause;
        private Boolean conexao = false;
        private SeekBar sb;
        private TextView textView;
        private TextView textView2;
        private TextView textView3;
        private NotificationManager mNotificationManager;
        private AudioManager audioManager;
        private ProgressDialog progressDialog;
    
        @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.player);
            sb = findViewById(R.id.seekBar);
    
            textView = findViewById(R.id.textView);
            textView2 = findViewById(R.id.textView2);
            textView3 = findViewById(R.id.textView3);
    
            progressDialog = new ProgressDialog(this);
    
            btnPlayPause = (Button) findViewById(R.id.btnPlayPause);
    
            btnPlayPause.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    try {
                        tocaPausa();
                    } catch (IOException e) {
                        e.printStackTrace();
                    }
                }
            });
    
            configuraAudioManager();
        }
    
        private void tocaPausa() throws IOException {
            if (conexao == true) {
                if (!mPlayer.isPlaying()) {
                    mPlayer.start();
                    btnPlayPause.setBackgroundResource(R.drawable.pause);
                } else {
                    mPlayer.pause();
                    btnPlayPause.setBackgroundResource(R.drawable.play);
                }
            } else {
                String url = "rtsp://cdn-the-2.musicradio.com:80/LiveAudio/Capital"; // your URL here
                new Play().execute(url);
            }
        }
    
    
        private void configuraAudioManager() {
            audioManager = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
    
            int maxVolume = audioManager.getStreamMaxVolume(AudioManager.STREAM_MUSIC);
            int volume    = audioManager.getStreamVolume(AudioManager.STREAM_MUSIC);
    
            sb.setMax(maxVolume);
            sb.setProgress(volume);
    
            sb.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
                @Override
                public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
                    audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, progress, AudioManager.FLAG_SHOW_UI);
    
                    Double total = progress * 6.666666666666667;
                    String valor =Integer.toString(Integer.valueOf(total.intValue()));
                    textView.setText(valor+" %");
    
                }
    
                @Override
                public void onStartTrackingTouch(SeekBar seekBar) {}
    
                @Override
                public void onStopTrackingTouch(SeekBar seekBar) {}
            });
        }
    
        @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
        private void notificacao (){
    
            NotificationCompat.Builder mBuilder =
                    new NotificationCompat.Builder(this)
                            .setSmallIcon(R.drawable.home)
                            .setContentTitle("Rádio Capital")
                            .setContentText("Agora deu");
    
            Intent resultIntent = new Intent(this, player.class);
            TaskStackBuilder stackBuilder = TaskStackBuilder.create(this);
            stackBuilder.addParentStack(player.class);
            stackBuilder.addNextIntent(resultIntent);
            PendingIntent resultPendingIntent = stackBuilder.getPendingIntent(0, PendingIntent.FLAG_UPDATE_CURRENT);
            mBuilder.setContentIntent(resultPendingIntent);
            mNotificationManager = (NotificationManager) getSystemService(Context.NOTIFICATION_SERVICE);
            mNotificationManager.notify(1, mBuilder.build());
    
        }
    
        private void contaBuffer () {
    
            textView2.setText(Integer.toString(mPlayer.getDuration()));
            mPlayer.setOnBufferingUpdateListener(
                    new MediaPlayer.OnBufferingUpdateListener() {
                        public void onBufferingUpdate(MediaPlayer mp, int percent)
                        {
                            double ratio = percent / 100.0;
                            int bufferingLevel = (int)(mp.getDuration() * ratio);
    
                            sb.setSecondaryProgress(bufferingLevel);
                            textView2.setText(Integer.toString(bufferingLevel));
                        }
    
                    }
    
            );
    
        }
    
    
        public void mostraBuffer() {
    
            mPlayer.setOnPreparedListener(new MediaPlayer.OnPreparedListener() {
                @Override
                public void onPrepared(MediaPlayer mediaPlayer) {
    
                    mediaPlayer.setOnInfoListener(new MediaPlayer.OnInfoListener() {
                        @Override
                        public boolean onInfo(MediaPlayer mp, int what, int extra) {
                            if (what == MediaPlayer.MEDIA_INFO_BUFFERING_END){
                                progressDialog.dismiss();
                                return true;
                            } else if(what == MediaPlayer.MEDIA_INFO_BUFFERING_START){
                                progressDialog.show();
                            }
                            return false;
                        }
                    });
                }
            });
    
        }
    
        @Override
        public void onBufferingUpdate(MediaPlayer mp, int percent) {
    
            textView3.setText(Integer.toString(percent));
    
        }
    
        class Play extends AsyncTask<String, Void ,Boolean > {
    
            @Override
            protected void onPreExecute() {
    
                btnPlayPause.setBackgroundResource(R.drawable.carregando);
                btnPlayPause.setEnabled(false);
    
            }
    
            @Override
            protected Boolean doInBackground(String... params) {
    
                try {
                    mPlayer = new MediaPlayer();
                    mPlayer.setAudioStreamType(AudioManager.STREAM_MUSIC);
                    mPlayer.setDataSource(params[0]);
                    mostraBuffer();
                    mPlayer.prepare(); // might take long! (for buffering, etc)
                    return true;
                } catch (IOException e) {
                    e.printStackTrace();
                }
    
                return false;
            }
            @Override
            protected void onPostExecute(Boolean result) {
    
                if (result == true){
                    btnPlayPause.setEnabled(true);
                    mPlayer.start();
                    conexao = true;
                    btnPlayPause.setBackgroundResource(R.drawable.pause);
                    contaBuffer();
                } else {
                    conexao = false;
                }
    
    
            }
    
        }
    
    }
  7. Situação mudou, acho que consegui.

    Mas agora o problema é outro.

    Tenho um array($todos) de objetos($cada)  e o seguinte foreach:

          foreach ($todos as $cada):
           
             $produto[] = (array) $cada;
        
             $produtos[] = array(
                   'idProduto' => $cada->getIdProduto(),
                   'tipo' => $cada->getTipo(),
                   'modelo' => $cada->getModelo(),
                   'bandejas' => $cada->getBandejas(),
                   'peso' => $cada->getPeso(),
                   'prensagem' => $cada->getPrensagem(),
                   'precoUnitario' => $cada->getPrecoUnitario(),
                   'comprimento' => $cada->getComprimento(),
                   'largura' => $cada->getLargura(),
                   'cabo' => $cada->getCabo(),
                   'ligacao' => $cada->getLigacao(),
                   'potencia' => $cada->getPotencia(),
                   'cosumo' => $cada->getConsumo(),
                   'corrente' => $cada->getCorrente(),
                   'disjuntor' => $cada->getDisjuntor(),
                   'descricao' => $cada->getDescricao(),
                   'estoque' => $cada->getEstoque(),
                   'freteGratis' => $cada->getFreteGratis(),
                   'bloqueado' => $cada->getBloqueado()
                      );    
                   
          endforeach;


    Preciso converter os arrays $produto e $produtos em JSON

    Segue os PRINT_R() de ambos.

    Esse é o PRINT_R do `Array` $produto:

       

    Array
        (
            [0] => Array
                (
                    [ProdutosidProduto] => 1
                    [Produtostipo] => mp
                    [Produtosmodelo] => F540 2 BAN.PNEU. 100 X 60
                    [Produtosbandejas] => 2
                    [Produtospeso] => 0
                    [Produtosprensagem] => 0
                    [ProdutosprecoUnitario] => 6500
                    [Produtoscomprimento] => 100
                    [Produtoslargura] => 60
                    [Produtoscabo] => 0
                    [Produtosligacao] => n
                    [Produtospotencia] => 0
                    [Produtosconsumo] => 0
                    [Produtoscorrente] => 0
                    [Produtosdisjuntor] => 0
                    [Produtosdescricao] => 
        Valor promocional limitado frete grátis ,para SP ,RJ ,MG ,ES. Os demais será cobrado apenas de SP para sua cidade ,valor de 500,00 ,a ser pago na entrega .
        
        
        
        MAQUINA TOTALMENTE INDUSTRIAL E 100% NACIONAL .PRODUÇÃO DE ATÉ MIL PÇS POR DIA EM HORÁRIO NORMAL DE TRABALHO ,SISTEMA DIGITAL AUTOMATIZADO DE ÚLTIMA GERAÇÃO , SISTEMA PNEUMÁTICO COMPACTO E UNIFORME RECEBENDO A MESMA PRESSÃO EM TODA ÁREA DE ESTAMPAGEM, EVITANDO ASSIM OS SOMBREAMENTOS E EFEITOS FANTASMA NA ESTAMPA , SISTEMA DE RESISTÊNCIA DE ALTA QUALIDADE A MELHOR DO MERCADO AÇO INOX 304 , DANDO UMA VIDA ÚTIL MUITO SUPERIOR AS DEMAIS DO MERCADO , E FÁCIL TROCAS DAS RESISTÊNCIAS NÃO SENDO NECESSÁRIO TÉCNICO NO LOCAL , COM APENAS 4 PARAFUSOS O CLIENTE MESMO FAZ A TROCA, AS DEMAIS A RESISTÊNCIA É FUNDIDA NA CHAPA DE ALUMÍNIO SENDO IMPOSSÍVEL A TROCA APENAS DAS RESISTÊNCIAS , TEMOS TODAS AS PÇS DA PRENSA EM VALORES BEM ACESSÍVEIS. 
                    [Produtosestoque] => 7
                    [ProdutosfreteGratis] => s
                    [Produtosbloqueado] => n
                )
        
            [1] => Array
                (
                    [ProdutosidProduto] => 2
                    [Produtostipo] => mp
                    [Produtosmodelo] => F540 2 BAN.PNEU.80X100 A VISTA BOLETO PAGSEGURO
                    [Produtosbandejas] => 2
                    [Produtospeso] => 190
                    [Produtosprensagem] => 300
                    [ProdutosprecoUnitario] => 7500
                    [Produtoscomprimento] => 70
                    [Produtoslargura] => 100
                    [Produtoscabo] => 6
                    [Produtosligacao] => b
                    [Produtospotencia] => 7500
                    [Produtosconsumo] => 3
                    [Produtoscorrente] => 35
                    [Produtosdisjuntor] => 40
                    [Produtosdescricao] => MAQUINA TOTALMENTE INDUSTRIAL E 100% NACIONAL .PRODUÇÃO DE ATÉ MIL PÇS POR DIA EM HORÁRIO NORMAL DE TRABALHO ,SISTEMA DIGITAL AUTOMATIZADO DE ÚLTIMA GERAÇÃO , SISTEMA PNEUMÁTICO COMPACTO E UNIFORME RECEBENDO A MESMA PRESSÃO EM TODA ÁREA DE ESTAMPAGEM, EVITANDO ASSIM OS SOMBREAMENTOS E EFEITOS FANTASMA NA ESTAMPA , SISTEMA DE RESISTÊNCIA DE ALTA QUALIDADE A MELHOR DO MERCADO AÇO INOX 304 , DANDO UMA VIDA ÚTIL MUITO SUPERIOR AS DEMAIS DO MERCADO , E FÁCIL TROCAS DAS RESISTÊNCIAS NÃO SENDO NECESSÁRIO TÉCNICO NO LOCAL , COM APENAS 4 PARAFUSOS O CLIENTE MESMO FAZ A TROCA, AS DEMAIS A RESISTÊNCIA É FUNDIDA NA CHAPA DE ALUMÍNIO SENDO IMPOSSÍVEL A TROCA APENAS DAS RESISTÊNCIAS , TEMOS TODAS AS PÇS DA PRENSA EM VALORES BEM ACESSÍVEIS. 
        www.topuhrens.de
        
        
        
        
                    [Produtosestoque] => 8
                    [ProdutosfreteGratis] => n
                    [Produtosbloqueado] => n
                )

    Esse é o `PRINT_R` do `Array` $produtos:

        Array
        (
            [0] => Array
                (
                    [idProduto] => 1
                    [tipo] => mp
                    [modelo] => F540 2 BAN.PNEU. 100 X 60
                    [bandejas] => 2
                    [peso] => 0
                    [prensagem] => 0
                    [precoUnitario] => 6500
                    [comprimento] => 100
                    [largura] => 60
                    [cabo] => 0
                    [ligacao] => n
                    [potencia] => 0
                    [cosumo] => 0
                    [corrente] => 0
                    [disjuntor] => 0
                    [descricao] => 
        Valor promocional limitado frete grátis ,para SP ,RJ ,MG ,ES. Os demais será cobrado apenas de SP para sua cidade ,valor de 500,00 ,a ser pago na entrega .
        
        
        
        MAQUINA TOTALMENTE INDUSTRIAL E 100% NACIONAL .PRODUÇÃO DE ATÉ MIL PÇS POR DIA EM HORÁRIO NORMAL DE TRABALHO ,SISTEMA DIGITAL AUTOMATIZADO DE ÚLTIMA GERAÇÃO , SISTEMA PNEUMÁTICO COMPACTO E UNIFORME RECEBENDO A MESMA PRESSÃO EM TODA ÁREA DE ESTAMPAGEM, EVITANDO ASSIM OS SOMBREAMENTOS E EFEITOS FANTASMA NA ESTAMPA , SISTEMA DE RESISTÊNCIA DE ALTA QUALIDADE A MELHOR DO MERCADO AÇO INOX 304 , DANDO UMA VIDA ÚTIL MUITO SUPERIOR AS DEMAIS DO MERCADO , E FÁCIL TROCAS DAS RESISTÊNCIAS NÃO SENDO NECESSÁRIO TÉCNICO NO LOCAL , COM APENAS 4 PARAFUSOS O CLIENTE MESMO FAZ A TROCA, AS DEMAIS A RESISTÊNCIA É FUNDIDA NA CHAPA DE ALUMÍNIO SENDO IMPOSSÍVEL A TROCA APENAS DAS RESISTÊNCIAS , TEMOS TODAS AS PÇS DA PRENSA EM VALORES BEM ACESSÍVEIS. 
                    [estoque] => 7
                    [freteGratis] => s
                    [bloqueado] => n
                )
        
            [1] => Array
                (
                    [idProduto] => 2
                    [tipo] => mp
                    [modelo] => F540 2 BAN.PNEU.80X100 A VISTA BOLETO PAGSEGURO
                    [bandejas] => 2
                    [peso] => 190
                    [prensagem] => 300
                    [precoUnitario] => 7500
                    [comprimento] => 70
                    [largura] => 100
                    [cabo] => 6
                    [ligacao] => b
                    [potencia] => 7500
                    [cosumo] => 3
                    [corrente] => 35
                    [disjuntor] => 40
                    [descricao] => MAQUINA TOTALMENTE INDUSTRIAL E 100% NACIONAL .PRODUÇÃO DE ATÉ MIL PÇS POR DIA EM HORÁRIO NORMAL DE TRABALHO ,SISTEMA DIGITAL AUTOMATIZADO DE ÚLTIMA GERAÇÃO , SISTEMA PNEUMÁTICO COMPACTO E UNIFORME RECEBENDO A MESMA PRESSÃO EM TODA ÁREA DE ESTAMPAGEM, EVITANDO ASSIM OS SOMBREAMENTOS E EFEITOS FANTASMA NA ESTAMPA , SISTEMA DE RESISTÊNCIA DE ALTA QUALIDADE A MELHOR DO MERCADO AÇO INOX 304 , DANDO UMA VIDA ÚTIL MUITO SUPERIOR AS DEMAIS DO MERCADO , E FÁCIL TROCAS DAS RESISTÊNCIAS NÃO SENDO NECESSÁRIO TÉCNICO NO LOCAL , COM APENAS 4 PARAFUSOS O CLIENTE MESMO FAZ A TROCA, AS DEMAIS A RESISTÊNCIA É FUNDIDA NA CHAPA DE ALUMÍNIO SENDO IMPOSSÍVEL A TROCA APENAS DAS RESISTÊNCIAS , TEMOS TODAS AS PÇS DA PRENSA EM VALORES BEM ACESSÍVEIS. 
        www.topuhrens.de
        
        
        
        
                    [estoque] => 8
                    [freteGratis] => n
                    [bloqueado] => n
                )
    


    Estou tentando assim

          var res1 =  Array(); 
          res1 = <?php echo json_encode($produto); ?>;
          document.write(res1[0]["ProdutosidProduto"])
        
          var res2 =  Array();
          res2 = <?php echo json_encode($produtos); ?>;
          document.write(res2[0]["idProduto"])  
    

    no JS, o res2 sai perfeito. Mas o res1 sai undefined

    Onde estou errando?

  8. Então, da forma abaixo o array gera corretamente:

      foreach ($todos as $cada):
    
         $produtos[] = array(
               'idProduto' => $cada->getIdProduto(),
               'tipo' => $cada->getTipo(),
               'modelo' => $cada->getModelo(),
               'bandejas' => $cada->getBandejas(),
               'peso' => $cada->getPeso(),
               'prensagem' => $cada->getPrensagem(),
               'precoUnitario' => $cada->getPrecoUnitario(),
               'comprimento' => $cada->getComprimento(),
               'largura' => $cada->getLargura(),
               'cabo' => $cada->getCabo(),
               'ligacao' => $cada->getLigacao(),
               'potencia' => $cada->getPotencia(),
               'cosumo' => $cada->getConsumo(),
               'corrente' => $cada->getCorrente(),
               'disjuntor' => $cada->getDisjuntor(),
               'descricao' => $cada->getDescricao(),
               'estoque' => $cada->getEstoque(),
               'freteGratis' => $cada->getFreteGratis(),
               'bloqueado' => $cada->getBloqueado()
                  );    
               
      endforeach;

    Mas o JSON só sai vazio

  9. 
     

    Concordo que não seja boa prática. 

    Nem vou fazer assim no final pois vou separar JS de PHP.

    Mas preciso passar objeto JSON diretamente sem precisar transformar o objeto em array para depois transformar em JSON.

    Pois na hora da transformação do objeto em array, ao invés de os índices virem assim:

    'meuIndice'

    eles estão vindo assim:

    [meuIndice]

    Então o JSON não está lendo!

  10. Tenho 2 Arrays:

    Array
    (
        [0] => Array
            (
                [0] => Amit
                [1] => amit@example.com
            )
    
        [1] => Array
            (
                [0] => Rahul
                [1] => rahul@example.com
            )
    
    )

    e

    Array
    (
        [0] => Array
            (
                [ProdutosidProduto] => 1
                [Produtostipo] => mp
                [Produtosmodelo] => F540 2 BAN.PNEU. 100 X 60
                [Produtosbandejas] => 2
                [Produtospeso] => 0
                [Produtosprensagem] => 0
                [ProdutosprecoUnitario] => 6500
                [Produtoscomprimento] => 100
                [Produtoslargura] => 60
                [Produtoscabo] => 0
                [Produtosligacao] => n
                [Produtospotencia] => 0
                [Produtosconsumo] => 0
                [Produtoscorrente] => 0
                [Produtosdisjuntor] => 0
                [Produtosdescricao] => 
    Valor promocional limitado frete grátis ,para SP ,RJ ,MG ,ES. Os demais será cobrado apenas de SP para sua cidade ,valor de 500,00 ,a ser pago na entrega .
    
    MAQUINA TOTALMENTE INDUSTRIAL E 100% NACIONAL .PRODUÇÃO DE ATÉ MIL PÇS POR DIA EM HORÁRIO NORMAL DE TRABALHO ,SISTEMA DIGITAL AUTOMATIZADO DE ÚLTIMA GERAÇÃO , SISTEMA PNEUMÁTICO COMPACTO E UNIFORME RECEBENDO A MESMA PRESSÃO EM TODA ÁREA DE ESTAMPAGEM, EVITANDO ASSIM OS SOMBREAMENTOS E EFEITOS FANTASMA NA ESTAMPA , SISTEMA DE RESISTÊNCIA DE ALTA QUALIDADE A MELHOR DO MERCADO AÇO INOX 304 , DANDO UMA VIDA ÚTIL MUITO SUPERIOR AS DEMAIS DO MERCADO , E FÁCIL TROCAS DAS RESISTÊNCIAS NÃO SENDO NECESSÁRIO TÉCNICO NO LOCAL , COM APENAS 4 PARAFUSOS O CLIENTE MESMO FAZ A TROCA, AS DEMAIS A RESISTÊNCIA É FUNDIDA NA CHAPA DE ALUMÍNIO SENDO IMPOSSÍVEL A TROCA APENAS DAS RESISTÊNCIAS , TEMOS TODAS AS PÇS DA PRENSA EM VALORES BEM ACESSÍVEIS. 
                [Produtosestoque] => 7
                [ProdutosfreteGratis] => s
                [Produtosbloqueado] => n
            )
    
        [1] => Array
            (
                [ProdutosidProduto] => 2
                [Produtostipo] => mp
                [Produtosmodelo] => F540 2 BAN.PNEU.80X100 A VISTA BOLETO PAGSEGURO
                [Produtosbandejas] => 2
                [Produtospeso] => 190
                [Produtosprensagem] => 300
                [ProdutosprecoUnitario] => 7500
                [Produtoscomprimento] => 70
                [Produtoslargura] => 100
                [Produtoscabo] => 6
                [Produtosligacao] => b
                [Produtospotencia] => 7500
                [Produtosconsumo] => 3
                [Produtoscorrente] => 35
                [Produtosdisjuntor] => 40
                [Produtosdescricao] => MAQUINA TOTALMENTE INDUSTRIAL E 100% NACIONAL .PRODUÇÃO DE ATÉ MIL PÇS POR DIA EM HORÁRIO NORMAL DE TRABALHO ,SISTEMA DIGITAL AUTOMATIZADO DE ÚLTIMA GERAÇÃO , SISTEMA PNEUMÁTICO COMPACTO E UNIFORME RECEBENDO A MESMA PRESSÃO EM TODA ÁREA DE ESTAMPAGEM, EVITANDO ASSIM OS SOMBREAMENTOS E EFEITOS FANTASMA NA ESTAMPA , SISTEMA DE RESISTÊNCIA DE ALTA QUALIDADE A MELHOR DO MERCADO AÇO INOX 304 , DANDO UMA VIDA ÚTIL MUITO SUPERIOR AS DEMAIS DO MERCADO , E FÁCIL TROCAS DAS RESISTÊNCIAS NÃO SENDO NECESSÁRIO TÉCNICO NO LOCAL , COM APENAS 4 PARAFUSOS O CLIENTE MESMO FAZ A TROCA, AS DEMAIS A RESISTÊNCIA É FUNDIDA NA CHAPA DE ALUMÍNIO SENDO IMPOSSÍVEL A TROCA APENAS DAS RESISTÊNCIAS , TEMOS TODAS AS PÇS DA PRENSA EM VALORES BEM ACESSÍVEIS. 
    www.topuhrens.de
    
    
                [Produtosestoque] => 8
                [ProdutosfreteGratis] => n
                [Produtosbloqueado] => n
            )
    
        [2] => Array
            (
                [ProdutosidProduto] => 3
                [Produtostipo] => mp
                [Produtosmodelo] => (PROMOÇÃO )2 BAN.PNEU.80X100, VALOR PROMOCIONAL .
                [Produtosbandejas] => 2
                [Produtospeso] => 200
                [Produtosprensagem] => 300
                [ProdutosprecoUnitario] => 8990
                [Produtoscomprimento] => 80
                [Produtoslargura] => 100
                [Produtoscabo] => 6
                [Produtosligacao] => b
                [Produtospotencia] => 7500
                [Produtosconsumo] => 3
                [Produtoscorrente] => 35
                [Produtosdisjuntor] => 40
                [Produtosdescricao] => MAQUINA TOTALMENTE INDUSTRIAL E 100% NACIONAL .PRODUÇÃO DE ATÉ MIL PÇS POR DIA EM HORÁRIO NORMAL DE TRABALHO ,SISTEMA DIGITAL AUTOMATIZADO DE ÚLTIMA GERAÇÃO , SISTEMA PNEUMÁTICO COMPACTO E UNIFORME RECEBENDO A MESMA PRESSÃO EM TODA ÁREA DE ESTAMPAGEM, EVITANDO ASSIM OS SOMBREAMENTOS E EFEITOS FANTASMA NA ESTAMPA , SISTEMA DE RESISTÊNCIA DE ALTA QUALIDADE replica watches for sale A MELHOR DO MERCADO AÇO INOX 304 , DANDO UMA VIDA ÚTIL MUITO SUPERIOR AS DEMAIS DO MERCADO , E FÁCIL TROCAS DAS RESISTÊNCIAS NÃO SENDO NECESSÁRIO TÉCNICO NO LOCAL , COM APENAS 4 PARAFUSOS O CLIENTE MESMO FAZ A TROCA, AS DEMAIS A RESISTÊNCIA É FUNDIDA NA CHAPA DE ALUMÍNIO SENDO IMPOSSÍVEL A TROCA APENAS DAS RESISTÊNCIAS , TEMOS TODAS AS PÇS DA PRENSA EM VALORES BEM ACESSÍVEIS. 
    
    CONSUMO : 3 KW/H 
    
                [Produtosestoque] => 97
                [ProdutosfreteGratis] => n
                [Produtosbloqueado] => n
            )
    

    Desejo transformá-los em JSON porém respeitando seus índices.

    Com o primeiro array fiz:

    var arr = <?php echo json_encode($myArr); ?>;
    

    com o segundo fiz 

    var res = <?php echo json_encode($produtos); ?>;
    

    Bom, quando fui conferir o JSON que saiu, verifiquei que 
    Para o primeiro Array temos que:

       document.write(arr[1][0]) => imprimiu Rahul;

    Para o segundo Array, temos que:

       document.write(res[0]["ProdutosidProduto"]) => Imprimiu undefined;

    Mas quando fiz:

       document.write(res) => imprimiu [object Object],[object Object]

       
    O que estou fazendo de errado?

    Se os Arrays são quase idênticos, onde está o erro?

    Será fato de que um tem índices como palavras e outro índices numéricos?

  11. <ifModule mod_rewrite.c>
      # LIGA O MOTOR DE REESCRITA (Rewrite)
      RewriteEngine on
      # BUSCA PELA BASE /crud/ NO HOST ACESSADO
      RewriteBase /crud/
      # FAZ UMA ESCESSÃO DE REDIRECIONAMENTO PARA A PÁGINA manutencao.php CASO O NAVEGADOR RECEBA ELA NA URL
      # PERCEBA O ! ANTES DO NOME DO ARQUIVO. ISSO DIZ AO .htaccess QUE O ARQUIVO EM QUESTÃO NÃO SEGUE A REGRA E ABRE NORMALMENTE
      RewriteCond %{REQUEST_URI} !/manutencao.php$ [NC]
      # FAZ UMA ESCESSÃO E LIBERA IMAGENS NESTA PAGINA
      # NOTE QUE PAR ESAS EXTENSÕES, O REDIRECIONAMENTO NÃO ACONTECE E DÁ ERRO 404 CASO A IMAGEM NÃO EXISTA
      # AS DEMAIS EXTENSÕES SÃO TODAS REENVIADAS PARA A INDEX
      RewriteCond %{REQUEST_URI} !.(jpe?g?|png|gif|css|js) [NC]
      # REENVIA QUALQUER ACESSO AO SITE PARA A PÁGINA index.php NO HOST INDICADO LIBERANDO AS EXCESSÕES ACIMA DESCRITAS
      RewriteRule .* index.php
    </ifModule>

     

  12. Bom, acho que tive progresso:

    Tenho o .htaccess abaixo e parece estar funcionando bem:

    <ifModule mod_rewrite.c>
      # LIGA O MOTOR DE REESCRITA (Rewrite)
      RewriteEngine on
      # BUSCA PELA BASE /teste/ NO HOST ACESSADO
      RewriteBase /teste/
      # FAZ UMA ESCESSÃO DE REDIRECIONAMENTO PARA A PÁGINA manutencao.php CASO O NAVEGADOR RECEBA ELA NA URL
      RewriteCond %{REQUEST_URI} !/manutencao.php$ [NC]
      # FAZ UMA ESCESSÃO E LIBERA IMAGENS NESTA PAGINA
      RewriteCond %{REQUEST_URI} !.(jpe?g?|png|gif) [NC]
      # REENVIA QUALQUER ACESSO AO SITE PARA A PÁGINA index.php NO HOST INDICADO LIBERANDO AS EXCESSÕES ACIMA DESCRITAS
      RewriteRule .* index.php
      #RewriteRule .* http://localhost/teste/index.php
      #RewriteRule .* http://localhost/teste/index.php [R=302,L]
    </ifModule>
    

    Porém, tenho algumas dúvidas:

    A ) Nenhuma das linhas abaixo funciona, ambas dá erro 500:

            #RewriteRule .* http://localhost/teste/index.php 
            #RewriteRule .* http://localhost/teste/index.php [R=302,L]

         Ou seja, não consigo enviar para o endereço de host completo apenas redireciona corretamente para a página específica :index.php
        Neste caso, se eu acessar por exemplo:    
          

     http://localhost/teste/outroteste/testando/index.php 


           o redirecionamento se fará para 
        

           http://localhost/teste/outroteste/testando/index.php

           
           ou seja, para o mesmo link e não para 
           

           http://localhost/teste/index.php

           
           Como se era esperado.
           
           Como corrigir isso?

           
    B)  A correção do item anterior deve resolver o problema deste item que é a lincagem dos arquivos css, js, imagens e tudo mais que compõem o arquivo a ser aberto.

    Quem poderá me ajudar?

    Arquivos envolvidos:

    .htaccess
    <ifModule mod_rewrite.c>
      # LIGA O MOTOR DE REESCRITA (Rewrite)
      RewriteEngine on
      # BUSCA PELA BASE /teste/ NO HOST ACESSADO
      RewriteBase /teste/
      # FAZ UMA ESCESSÃO DE REDIRECIONAMENTO PARA A PÁGINA manutencao.php CASO O NAVEGADOR RECEBA ELA NA URL
      RewriteCond %{REQUEST_URI} !/manutencao.php$ [NC]
      # FAZ UMA ESCESSÃO E LIBERA IMAGENS NESTA PAGINA
      RewriteCond %{REQUEST_URI} !.(jpe?g?|png|gif) [NC]
      # REENVIA QUALQUER ACESSO AO SITE PARA A PÁGINA index.php NO HOST INDICADO LIBERANDO AS EXCESSÕES ACIMA DESCRITAS
      RewriteRule .* index.php
      #RewriteRule .* http://localhost/teste/index.php
      #RewriteRule .* http://localhost/teste/index.php [R=302,L]
    </ifModule>

    index.php

    INDEX
    <?php
     
      header ("Location: http://localhost/teste/manutencao.php"); 
      
    ?>
    

    manutencao.php

    <?php
     
      echo "MANUTENÇÃO  "; 
      
    ?>
  13.  RewriteEngine On
     RewriteBase /crud/
    
     # TODAS URLS CAEM NO INDEX.
     RewriteCond %{SCRIPT_FILENAME} !-f
     RewriteCond %{SCRIPT_FILENAME} !-d
     RewriteRule ^([^/]*)$ index.php [L]  
     
     # SE POR ACASO, A URL FOR manutencao.php, LIBERA ACESSO A ELA
     # NESSE CASO, FICA ÓBVIO QUE PARA TODAS AS PÁGINA PRECISARÁ HAVER UM REDIRECIONAMENTO 
     # À manutenção.php. SENÃO, NÃO FUNCIONARÁ! 
     RewriteCond %{HTTP_HOST} ^manutencao.php [NC]
     RewriteRule ^(.*)$ manutencao.php/$1 [L,R=301]     
        
     # ROTAS DE ERROS    
     ErrorDocument 401 http://localhost/crud/401.php
     ErrorDocument 403 http://localhost/crud/403.php
     ErrorDocument 404 http://localhost/crud/404.php
     ErrorDocument 500 http://localhost/crud/500.php 

     

  14. Olá, vi uma matéria referindo-se à manutenção de sites na url http://desenvolvimentoparaweb.com/miscelanea/htaccess-redirecionamento-automatico-sites-em-manutencao/ e fiquei com uma dúvida e gostaria de saber se podem me ajudar a tirá-la.

    Seguinte: tenho um site e nele, redireciono, via .htacces todas as requisições para serem tratadas no index.php conforme abaixo:
     RewriteEngine On
     RewriteBase /crud/
     RewriteRule .* index.php

    Porém, tenho uma classe que trata as entradas e tem um atributo 

    static private $livre = true;
    Ela, se setada para false, envia, no construtor da classe  , para a pagina mantencao.php.
     
    public function __construct($_util) {
           if (self::$livre == "false") header ("Location: manutencao.php");

    Porém, como todas as requisições acabam indo para o index.php, quando chega na manutenção.php acaba voltando para index.php por cauda do .htacess e fica num loop infinito.

    Será que existe uma forma de fazer uma tratativa no .httaccess de forma tal que se a url que chega for  manutencao.php, então o redirecionamento para index.php não ocorra?
     
    Grato se puder ajudar.
     
    Att,
     
    Carlos Rocha
  15. Estou tentando aprender namespace mas estou tendo dificuldade.

    Mesmo fazendo exatamente como está em um vídeo no youtube, mas não dá certo.

    Tenho a pasta do projeto

    Citação

    Projeto
    Projeto\Cadastros
    Projeto\Cadastros\Index.php
    Projeto\Cadastros\Pessoa
    Projeto\Cadastros\Pessoa\Pessoa.php
    Projeto\Cadastros\Teste
    Projeto\Cadastros\Teste\Pessoa.php


    Index.php

    <?php
     
     ini_set("display_errors",true);
     ini_set("display_startup_erros",1);
     error_reporting(E_ALL && E_NOTICE);
     error_reporting( E_ALL | E_STRICT ); // PHP 5.3
     error_reporting( E_ALL ); // Todas as outras versões 
    
     $pessoa = new Pessoa(1, 40, "Carlos");
     
     $pessoa2 = new Pessoa2();
     $pessoa2->setIdPessoa(1);
     $pessoa2->setIdadePessoa(43);
     $pessoa2->setNomePessoa("Cleonice");
     
     
     echo $pessoa->getIdPessoa()."<br >";
     echo $pessoa->getNome()."<br >";
     echo $pessoa->getIdadePessoa()."<br >";
     
     echo "<br />";
     
     echo $pessoa2->getIdPessoa()."<br >";
     echo $pessoa2->getNomePessoa()."<br >";
     echo $pessoa2->getIdadePessoa()."<br >"; 
    
    
    ?>
    

    Pessoa.php

    <?php
    
    namespace Cadastros\Pessoa\Pessoa;
    
    Class Pessoa {
        
        private $idPessoa;
        private $idadePessoa;
        private $nome;
        
        public function __construct ($_idPessoa, $_idadePessoa, $_nome) {
            $this->idPessoa = $_idPessoa;
            $this->idadePessoa = $_idadePessoa;
            $this->nome = $_nome;
        }
        
        public function getIdPessoa () {
            return $this->idPessoa;
        }
        
        public function getIdadePessoa () {
            return $this->idadePessoa;
        }
        
        public function getNome () {
            return $this->nome;
        }
    }
    
    
    ?>
    

    Pessoa.php

    <?php
    
    namespace Cadastros\Teste\Pessoa;
    
    Class Pessoa {
        
        private $idPessoa;
        private $idadePessoa;
        private $nomePessoa;
        
        public function __construct () {}
            
        
        public function setIdPessoa ($_idPessoa) {
            $this->idPessoa = $_idPessoa;
        }    
        
        public function setIdadePessoa ($_idadePessoa) {
            $this->idadePessoa = $_idadePessoa;
        }    
        
        public function setNomePessoa ($_nomePessoa) {
            $this->nomePessoa = $_nomePessoa;
        }
        
        public function getIdPessoa () {
            return $this->idPessoa;
        }
        
        public function getIdadePessoa () {
            return $this->idadePessoa;
        }
        
        public function getNomePessoa () {
            return $this->nomePessoa;
        }
    }
    
    
    ?>

    Erro

    Citação

     

    Fatal error: Uncaught Error: Class 'Pessoa' not found in C:\Program Files\Apache24\Apache24\htdocs\funerariasaopedro.net.br\Cadastros\index.php:19 Stack trace: #0 {main} thrown in C:\Program Files\Apache24\Apache24\htdocs\funerariasaopedro.net.br\Cadastros\index.php on line 19

     

     

     

    O que está de errado?

  16. Bom Dia!

    Tenho a seguinte página

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Slider</title>
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="_css/aos.css">
    <link rel="stylesheet" type="text/css" href="_css/jquery.cycle2.css">
    <script type="text/javascript" src="_js/jquery.js"></script>
    <script type="text/javascript" src="_js/jquery.cycle2.min.js"></script>
    <style>
    @import url('http://fonts.googleapis.com/css?family=Open+Sans');
    * {
    	font-family: 'Open Sans';
    	margin: 0;
    	padding: 0;
    	box-sizing: content-box;
    }
    img {
    	border: 0;
    	max-width: 100%;
    }
    ul {
    	list-style: none;
    }
    ul li {
    	display: inline;
    }
    .aos-all {
    	width: 1000px;
    	max-width: 98%;
    	margin: 10vh auto 0 auto;
    }
    .aos-item {
    	display: inline-block;
    	float: left;
    	width: 40%;
    	height: 300px;
    	padding: 20px;
    }
    .aos-item__inner {
    	position: relative;
    	width: 100%;
    	height: 100%;
    	float: left;
    	background: #1da4e2;
    	line-height: 260px;
    	text-align: center;
    	color: #fff;
    }
    
    @media screen and (max-width: 800px) {
    .aos-item {
    	width: 50%;
    }
    }
    .logo {
    	width : 432px;
    	-webkit-animation : logo-anim 1s;
    	-moz-animation : logo-anim 1s;
    	-o-animation : logo-anim 1s;
    	animation : logo-anim 1s;
    }
     @-webkit-keyframes logo-anim {
     0% {
     opacity : 0;
     transform : translateY(-50px);
     -webkit-transform : translateY(-50px);
     -moz-transform : translateY(-50px);
     -o-transform : translateY(-50px);
     -ms-transform : translateY(-50px);
    }
     100% {
     opacity : 1;
     transform : translateY(0px);
     -webkit-transform : translateY(0px);
     -moz-transform : translateY(0px);
     -o-transform : translateY(0px);
     -ms-transform : translateY(0px);
    }
    }
     @-moz-keyframes logo-anim {
     0% {
     opacity : 0;
     transform : translateY(-50px);
     -webkit-transform : translateY(-50px);
     -moz-transform : translateY(-50px);
     -o-transform : translateY(-50px);
     -ms-transform : translateY(-50px);
    }
     100% {
     opacity : 1;
     transform : translateY(0px);
     -webkit-transform : translateY(0px);
     -moz-transform : translateY(0px);
     -o-transform : translateY(0px);
     -ms-transform : translateY(0px);
    }
    }
     @-o-keyframes logo-anim {
     0% {
     opacity : 0;
     transform : translateY(-50px);
     -webkit-transform : translateY(-50px);
     -moz-transform : translateY(-50px);
     -o-transform : translateY(-50px);
     -ms-transform : translateY(-50px);
    }
     100% {
     opacity : 1;
     transform : translateY(0px);
     -webkit-transform : translateY(0px);
     -moz-transform : translateY(0px);
     -o-transform : translateY(0px);
     -ms-transform : translateY(0px);
    }
    }
     @keyframes logo-anim {
     0% {
     opacity : 0;
     transform : translateY(-50px);
     -webkit-transform : translateY(-50px);
     -moz-transform : translateY(-50px);
     -o-transform : translateY(-50px);
     -ms-transform : translateY(-50px);
    }
     100% {
     opacity : 1;
     transform : translateY(0px);
     -webkit-transform : translateY(0px);
     -moz-transform : translateY(0px);
     -o-transform : translateY(0px);
     -ms-transform : translateY(0px);
    }
    }
    .logo-atividades {
    	position : absolute;
    	top : 0;
    	center : 0;
    	width : 100%;
    	height : 500px;
    	text-align : center;
    	overflow : hidden;
    	z-index : 20;
    }
    .atividades {
    	color : #FFF;
    	height : 115px;
    	overflow : hidden;
    	position : absolute;
    	top : 80%;
    	margin-top : -176px;
    	width : 100%;
    	pointer-events : none;
    	text-align : center;
    	z-index : 10;
    }
    .atividades a {
    	text-decoration : none;
    }
    
    .atividades ul {
    	list-style : none;
    	padding : 0;
    	margin : 10px 0 0;
    	position : relative;
    	height : 100px;
    	font-size : 36px;
    	font-weight : 300;
    	text-align : center;
    	font-family : 'Lato', sans-serif;
    	letter-spacing : 5px;
    	text-transform : uppercase;
    	z-index : 100;
    }
    .atividades ul li {
    	width : 100%;
    	text-align : center;
    	position : absolute;
    	opacity : 0;
    	top : 85px;
    	line-height : 100px;
    	-webkit-transition : all 0.5s ease-in-out;
    	-moz-transition : all 0.5s ease-in-out;
    	-o-transition : all 0.5s ease-in-out;
    	transition : all 0.5s ease-in-out;
    	transition-timing-function : ease;
    	-webkit-transition-timing-function : ease; /* Safari and Chrome */
    }
    .atividades ul li.ativa {
    	opacity : 1;
    	top : 0;
    	-webkit-transition : all 1s ease-in-out;
    	-moz-transition : all 1s ease-in-out;
    	-o-transition : all 1s ease-in-out;
    	transition : all 1s ease-in-out;
    	transition-timing-function : ease;
    	-webkit-transition-timing-function : ease; /* Safari and Chrome */
    }
    }
    </style>
    </head>
    <body>
      <div class="cycle-slideshow"
               data-cycle-fx=fadeout
               data-cycle-timeout=5000
               data-cycle-pause-on-hover="true"
               data-cycle-slides="div.slide">
      
              <div class="logo-atividades">
                <div style="margin-top: 100px;"> 
                  <a href="http://www.funerariasaopedro.net.br"> 
                    <img class="logo" src="_img/logoFuneraria.png" alt="Logo"/> 
                  </a>
                  <div class="atividades">
                    <ul>
                      <li class="ativa">Agência Funerária</li>
                      <li>Funerais</li>
                      <li>Cremações</li>
                      <li>Trasladações</li>
                      <li>Tanatopraxias</li>
                      <li>Exumações</li>
                      <li>Artigos Religiosos</li>
                      <li>Atendimento 24h</li>
                    </ul>
                  </div>
                </div>
              </div>
              
              <!-- prev/next links -->
              <div class="cycle-prev"></div>
              <div class="cycle-next"></div>
              <div class="cycle-pager"></div>
              <div class="slide"> <img  src="_img/_banner/_site/1.png" /> </div>
              <div class="slide"> <img  src="_img/_banner/_site/2.png" /> </div>
              <div class="slide"> <img  src="_img/_banner/_site/3.png" /> </div>
              <div class="slide"> <img  src="_img/_banner/_site/4.png" /> </div>
      </div>
      <div class="aos-item" data-aos="fade-right">
        <div class="aos-item__inner">
          <h3>Esquerda</h3>
        </div>
      </div>
      <div class="aos-item" data-aos="fade-left">
        <div class="aos-item__inner">
          <h3>Direita</h3>
        </div>
      </div>
      <div class="aos-item" data-aos="fade-up">
        <div class="aos-item__inner">
          <h3>Baixo Cima</h3>
        </div>
      </div>
      <div class="aos-item" data-aos="fade-down">
        <div class="aos-item__inner">
          <h3>Cima Baixo</h3>
        </div>
      </div>
      <div class="aos-item" data-aos="fade-in">
        <div class="aos-item__inner">
          <h3>Baixo Cima</h3>
        </div>
      </div>
      <div class="aos-item" data-aos="fade-in">
        <div class="aos-item__inner">
          <h3>Cima Baixo</h3>
        </div>
      </div>
      <script>
          function homeTitleAnimation(){
              var interval;
              var counter = 1;
              var myFunc = function() {
                  var cur = $('.atividades ul li').length;
                  if(cur == counter) {
                      $('.atividades ul li.ativa').removeClass('ativa');
                      $('.atividades ul li').first().addClass('ativa');
                      counter = 1;
                  } else {
                      counter++;
                      $('.atividades ul li.ativa').removeClass('ativa').next().addClass('ativa');
      
                  }
              };
              interval = setInterval(myFunc, 4000);
          }
      
          homeTitleAnimation();  
      </script>
      
      <script src="_js/aos.js"></script> 
      <script>
              AOS.init({
                easing: 'ease-in-out-sine'
              });  
      </script> 
     </body>
    </html>

    Tudo funciona corretamente com exceção do posicionamento da logo e da ul  que rodam sobre o Slideshow que não estou conseguindo posiciona-los sobre o Slideshow.

     <div class="cycle-slideshow"
               data-cycle-fx=fadeout
               data-cycle-timeout=5000
               data-cycle-pause-on-hover="true"
               data-cycle-slides="div.slide">
      
              <div class="logo-atividades">
                <div style="margin-top: 100px;"> 
                  <a href="http://www.funerariasaopedro.net.br"> 
                    <img class="logo" src="_img/logoFuneraria.png" alt="Logo"/> 
                  </a>
                  <div class="atividades">
                    <ul>
                      <li class="ativa">Agência Funerária</li>
                      <li>Funerais</li>
                      <li>Cremações</li>
                      <li>Trasladações</li>
                      <li>Tanatopraxias</li>
                      <li>Exumações</li>
                      <li>Artigos Religiosos</li>
                      <li>Atendimento 24h</li>
                    </ul>
                  </div>
                </div>
              </div>
              
              <!-- prev/next links -->
              <div class="cycle-prev"></div>
              <div class="cycle-next"></div>
              <div class="cycle-pager"></div>
              <div class="slide"> <img  src="_img/_banner/_site/1.png" /> </div>
              <div class="slide"> <img  src="_img/_banner/_site/2.png" /> </div>
              <div class="slide"> <img  src="_img/_banner/_site/3.png" /> </div>
              <div class="slide"> <img  src="_img/_banner/_site/4.png" /> </div>
      </div>

    Onde estou errando?

    Esse código pode ser visto em :

    http://funerariasaopedro.net.br/novo/

     

    Na página, se derem um ctr+a, poderão notar no canto direito e abaixo do slide,  a ul rodando normalmente. Porém a posição correta dela é no meio do slide e ao centro.

     

    Com relação à logomarca que está escondida atrás do slide, sua posição é acima do slide e acima da ul

  17. Estou tentando implementar um BINA com Delphi 7 usando Super Bina!

    Adicionei o componente no form e num botão fiz:

    procedure TfrmPrincipal.btnAbreConClick(Sender: TObject);
    var
      texto: String;
    begin
      spBina.Conectado:=true;
      spBina.LeiaDTMF(texto,100);
      ShowMessage(texto);
    end;

    e no onDTMF fiz

    procedure TfrmPrincipal.spBinaDTMF(Sender: TObject; Count: Integer);
    var
      Buffer : String;
      Contador: Integer;
    begin
    
      // Define o valor do Time Out
      Sleep(500);
      // Confere o número total de bytes dentro do pacote enviado
      Contador := spBina.InputCount;
      // Lê o pacote enviado e armazena no Buffer
      spBina.Read(Buffer, Contador);
      // Alimenta um campo Memo com os dados recebidos
      Memo1.Lines.Add(Buffer);
    end;

    Então, no código do botão, ao chegar o ring da linha telefônica eu recebo RING no ShowMessage. Só isso! no código do onDTMF, ao chegar spBina.Read(Buffer, Contador);, está dando erro de acesso à memória!

    Como corrigir isso?

     

    Percebi que o erro é na função abaixo:

     

    // Ler no modo sincrono
    function TSspBina.ReadAsync(var Buffer; Count: Integer; var AsyncPtr: PAsync): Integer;
    var
      Success: Boolean;
      BytesTrans: DWORD;
    begin
      AsyncPtr^.Kind := okRead;
      Success := ReadFile(FHandle, Buffer, Count, BytesTrans, @AsyncPtr^.Overlapped)
        or (GetLastError = ERROR_IO_PENDING);
    
      if not Success then
        raise ECspBina.Create(CError_ReadFailed, GetLastError);
        
      Result := BytesTrans;
    end;

    quando faz o ReadFile

     

     

  18. Opa, beleza. mas o exemplo que você deu, faz e recebe ligações.

    Porém, quando recebe, não mostra o número da pessoa que está ligando para o modem! É o que eu mais preciso.

     

    Experimentei usar o projeto da superrbina em conjunto mas como usa a mesma porta COM3 que é a do modem, então nada fucniona!

     

    O que fazer nesse caso?

  19. Boa Tarde!

     

    Então, estou em um dilema.

     

    Lembram daquelas plaquinhas de FAX Modem de 56kbps que usávamos para acessar a internet via linha discada?

    Então, tenho ela no meu NoteBook e no PC também.

     

    Estou criando uma aplicação que vai precisar acessar essa placa.

     

    Existe algum componente que faça isso?

     

    Por exemplo:

     

    ZeusTable:  acessa uma tabela
    ____???__:  acessa a placa!

     

    Alguém pode me instruir?

     

    Atualmente estou usando o Delphi na RAD Studio 2017!

×
×
  • Criar Novo...