Ir para conteúdo

Arquivado

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

Fernandroid

Gostaria de configurar dois botoes para rolar a pagina (descer e subir)

Recommended Posts

Queria configurar os botoes de subir e descer para dar scroll na pagina. 

Atualmente só consegui dar um scroll em uma determina parte da pagina, gostaria de configurar para ir clicando e a pagina rolando para baixo ou para cima. 

Aqui está o codigo exemplo, se clicar no texto, o popup abre com os tres botoes, o botao "fechar" ja consegui configurar.

 

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<style type="text/css">
		* {
			padding: 0;
			margin: 0;
		}
		html, body {
			background: silver;
			color: #fff;
			overflow: hidden;
			touch-action: none;
			-ms-touch-action: none;
		}
		canvas {
			touch-action-delay: none;
			touch-action: none;
			-ms-touch-action: none;
		}
		.container_black{
			background: rgba(0,0,0,0.3);
			width: 100%;
			height: 100%;
			position: fixed;
			z-index: 9999;
			top: 0;
			left: 0;
			display:none
		}
		
		.container_popup{
			background: #fff;
			width: 90%;
			height: 90%;
			overflow: auto;
			position: fixed;
			top: 5%;
			left: 5%;
			color: #666;
			padding: 10px;
			box-sizing: border-box;
			font-family: Tahoma, Geneva, sans-serif;
			border: 3px solid #666;
			box-shadow: -3px 3px 4px 1px rgba(0, 0, 0, 0.33);
		}
		
		.container_popup h1 {margin: 10px 0;}
		.container_popup p { margin: 10px 0; }
		
		.fechar_popup{
			padding: 10px;
			text-align: center;
			background: #666;
			color: #fff;
			font-weight: bold;
			font-family: Tahoma, Geneva, sans-serif;
			text-transform: uppercase;
			width: 20px;
			cursor: pointer;
			position: fixed;
			right: 5%;
			top: 5%;
		}
        
        .descer{
			padding: 10px;
			text-align: center;
			background: #666;
			color: #fff;
			font-weight: bold;
			font-family: Tahoma, Geneva, sans-serif;
			text-transform: uppercase;
			width: 30px;
			cursor: pointer;
			position: fixed;
			right: 5.5%;
			top: 86.5%;
		}
         .subir{
			padding: 10px;
			text-align: center;
			background: #666;
			color: #fff;
			font-weight: bold;
			font-family: Tahoma, Geneva, sans-serif;
			text-transform: uppercase;
			width: 30px;
			cursor: pointer;
			position: fixed;
			right: 5.5%;
			top: 77%;
        
    </style>

</head>
<body>



<div class="container_black">
		<div class="container_popup">
        <div id="lista">
			<h1>Política de Privacidade</h1>
			<p>Esses tipos de serviços permitem a interação com as redes sociais ou outras plataformas externas diretamente a partir das páginas deste serviço (este aplicativo). A interação e as informações obtidas por este aplicativo estão sempre sujeitas às configurações de privacidade do usuário em cada rede social. Se um serviço que permite a interação com as redes sociais estiver instalado poderá coletar dados de tráfego para as páginas, onde o serviço esteja instalado, mesmo quando os usuários não estiverem usando os mesmos.</p>
<h4>O botão Curtir e widgets sociais do Facebook (Facebook, Inc.)</h4>
<p>O botão Curtir do Facebook e widgets sociais são serviços que permitem a interação com a rede social Facebook fornecido pela Facebook, Inc.</p>
<p>Dados pessoais coletados: cookie e dados de uso. Local de processamento: EUA  Política de Privacidade.</p>
<h3>Contatar o usuário</h3>
<h4>Lista de endereçamento ou boletim informativo (este aplicativo)</h4>
<p>Ao registar-se na lista de endereçamento ou no boletim informativo, o endereço de e-mail do usuário será adicionado à lista de contatos daqueles que podem receber mensagens de e-mail que contenham informações de natureza comercial ou promocional sobre este Aplicativo. O seu endereço de e-mail também poderá ser adicionado a esta lista, como resultado de sua inscrição neste serviço (este aplicativo).</p>
<h2>Informações adicionais sobre a coleta e processamento de dados</h2>
<h3>Ação jurídica</h3>
<p>Os dados pessoais dos usuários podem ser utilizados para fins jurídicos pelo controlador de dados em juízo ou nas etapas conducentes à possível ação jurídica decorrente de uso indevido deste serviço (este aplicativo) ou dos serviços relacionados.</p>
<p>O usuário declara estar ciente de que o controlador dos dados poderá ser obrigado a revelar os dados pessoais mediante solicitação das autoridades governamentais.</p>
<h3>Informações adicionais sobre os dados pessoais do usuário</h3>
<p>Além das informações contidas nesta política de privacidade, este aplicativo poderá fornecer ao usuário informações adicionais e contextuais sobre os serviços específicos ou a coleta e processamento de dados pessoais mediante solicitação.</p>
<h3>Logs do sistema e manutenção</h3>
<p>Para fins de operação e manutenção, este aplicativo e quaisquer serviços de terceiros poderão coletar arquivos que gravam a interação com este aplicativo (logs do sistema) ou usar, para este fim, outros dados Pessoais (tais como o endereço IP).</p>
<h3>As informações não contidas nesta política</h3>
<p>Mais detalhes sobre a coleta ou processamento de dados pessoais podem ser solicitados ao controlador de dados, a qualquer momento. Favor ver as informações de contato no início deste documento.</p>
<h3>Os direitos dos usuários</h3>
<p>Os usuários têm o direito de, a qualquer tempo, consultar o controlador de dados para saber se os seus dados pessoais foram armazenados e saber mais sobre o conteúdo e origem, verificar a sua exatidão ou para pedir que sejam complementados, cancelados, atualizados ou corrigidos, ou que sejam transformados em formato anônimo ou bloquear quaisquer dados mantidos em violação da lei, bem como se opor ao seu tratamento por quaisquer todas as razões legítimas. Os pedidos devem ser enviados para o controlador de dados usando a informação de contato fornecida anteriormente.</p>
<p>Este aplicativo não suporta pedidos de &#8220;Não me rastreie&#8221;.</p>
<p>Para determinar se qualquer um dos serviços de terceiros que utiliza honram solicitações de &#8220;Não me rastreie&#8221;, por favor leia as políticas de privacidade.</p>
<h3>Mudanças nesta política de privacidade</h3>
<p>O controlador de dados se reserva o direito de fazer alterações nesta política de privacidade a qualquer momento, mediante comunicação aos seus usuários nesta página. É altamente recomendável que esta página seja consultada várias vezes em relação à última modificação descrita na parte inferior. Se o Usuário não concorda com qualquer das alterações da política de privacidade, o usuário deve cessar o uso deste serviço (este aplicativo) e pode solicitar ao controlador de dados que apague os dados pessoais dele. Salvo disposição em contrário, a atual política de privacidade se aplica a todos os dados pessoais dos usuários que o controlador de dados tiver.</p>
<h3>Definições e referências jurídicas</h3>
<h3>Dados pessoais (ou dados)</h3>
<p>Quaisquer informações relativas a uma pessoa física, pessoa jurídica, instituição ou associação, as quais sejam, ou possam ser identificadas, mesmo que indiretamente, por referência a quaisquer outras informações, incluindo um número de identificação pessoal.</p>
<h3>Dados de uso</h3>
<p>As informações coletadas automaticamente a partir deste serviço (ou serviços de terceiros contratados neste serviço (este aplicativo), que podem incluir: os endereços IP ou nomes de domínio dos computadores utilizados pelos usuários que utilizam este aplicativo, os endereços URI (Identificador Uniforme de Recurso), a data e hora do pedido, o método utilizado para submeter o pedido ao servidor, o tamanho do arquivo recebido em resposta, o código numérico que indica o status do servidor de resposta (resultado positivo, erro , etc.), o país de origem, as características do navegador e do sistema operacional utilizado pelo usuário, os vários detalhes de tempo por visita (por exemplo, o tempo gasto em cada página dentro do aplicativo) e os detalhes sobre o caminho seguido dentro da aplicação, com especial referência à sequência de páginas visitadas e outros parâmetros sobre o sistema operacional do dispositivo e/ou ambiente de TI do Usuário.</p>
<h3>Usuário</h3>
<p>A pessoa que usa este aplicativo que deverá coincidir com ou estar autorizada pelo titular dos dados a quem os dados pessoais se referem.</p>
<h3>Titular dos dados</h3>
<p>A pessoa jurídica ou física a quem os dados pessoais se referem.</p>
<h3>Processador de dados (ou supervisor de dados)</h3>
<p>A pessoa física, pessoa jurídica, a administração pública ou qualquer outro órgão, associação ou organização autorizada pelo controlador de dados para o processamento dos dados pessoais em conformidade com esta política de privacidade.</p>
<h3>Controlador de dados (ou proprietário)</h3>
<p>A pessoa física, pessoa jurídica, administração pública ou qualquer outra entidade, associação ou organização com direitos, também em conjunto com outro controlador dos dados, para tomar decisões sobre as finalidades e os métodos de processamento de dados pessoais e os meios utilizados, incluindo medidas de segurança relativas ao funcionamento e ao uso deste serviço. O controlador de dados, a menos que seja especificado de outra forma, é o proprietário deste serviço (este aplicativo).</p>
<h3>Este aplicativo / Jogo</h3>
<p>A ferramenta de hardware ou software pela qual os dados pessoais do usuário são coletados.</p>
<h3>Cookie</h3>
<p>Pequenas unidades de dados armazenados no dispositivo do usuário.</p>
<h2>Informação jurídica</h2>
<p>Aviso aos usuários europeus: esta declaração de privacidade foi elaborada em cumprimento das obrigações nos termos do art. n.10 da Diretiva 95/46/CE, e de acordo com as disposições da Diretiva 2002/58/CE, tal como revisto pela Diretiva 2009/136/CE, sobre o assunto de Cookies.</p>
<p>Esta política de privacidade é apenas sobre este Aplicativo/Jogo.</p>
<p><bltima atualização:</b> 25 de Fevereiro de 2018</p>
<p>&nbsp;</p>
</div>
 
		<div class="fechar_popup">X</div>
        <div class="descer">⬇</div>
        <div class="subir">⬆</div>
	</div><!--container_popup-->
	</div><!--container_black-->

	<div id="fb-root"></div>
    
    
    
<p>Clique para aparecer o poup</p>
<p>Clique para aparecer o poup</p>
<p>Clique para aparecer o poup</p></div>

<script>
$(document).ready(function(){
    $("p").click(function(){
      $(".container_black").fadeIn(); 
    });
});
</script> 

<script>
$(document).ready(function(){
      $(".fechar_popup").click(function(){
			$(".container_black").fadeOut();
              });       
});
</script> 

	
<script>
$(document).ready(function(){
      $(".descer").click(function(){
			$(".container_popup").animate({
        scrollTop: 1000
    }, 1000);
              });       
});
</script> 

<script>
$(document).ready(function(){
      $(".subir").click(function(){
			$(".container_popup").animate({
        scrollTop: 0
    }, 500);
              });       
});
</script>

</body>
</html>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por 4Unknow
      Fala galera, mais uma dúvida aqui.
      Eu to usando uma página para criar minhas políticas de privacidade e cookies, informações no caso.

      Porém coloco todas informações na página, mas quando clico em um item não aparece tudo o que eu digitei, se notarem no código fonte tem muito mais texto e informação para mostrar mas ele corta.

      Vou deixar link para download do mediafire do arquivo, não tem anuncio de nada no arquivo, apenas html puro mesmo e css com informações bem básicas.
       
      BAIXAR PÁGINA.ZIP

      Grato pela ajuda.
    • Por 4Unknow
      Fala galerinha beleza, bom vamos lá.
      Eu tenho um site que o conteúdo dele é tudo em uma página só, o menu, quando escolho uma opção ele leva em uma determinada parte do site referente ao menu clicado. Até aqui ok.
      Porém eu instalei um botão para voltar para o topo quando rola o site para baixo, e como sou leigo em Java, notei que parece que tá tendo conflito com o ScrollTop, pois o botão que coloquei para voltar para o topo também tem o scrolltop. Gostaria de fazer funcionar o menu e o botão juntos, pois quando desativo o .js do botão o menu  funciona normal, quando ativo o botão novamente ele para de funcionar.

      Vou deixar o código de ambos aqui.

      .JS do Menu (scroll.min.js)

       
      (function(e){"use strict";var t="ScrollIt",n="1.0.3";var r={upKey:38,downKey:40,easing:"linear",scrollTime:600,activeClass:"active",onPageChange:null,topOffset:0};e.scrollIt=function(t){var n=e.extend(r,t),i=0,s=e("[data-scroll-index]:last").attr("data-scroll-index");var o=function(t){if(t<0||t>s)return;var r=e("[data-scroll-index="+t+"]").offset().top+n.topOffset+1;e("html,body").animate({scrollTop:r,easing:n.easing},n.scrollTime)};var u=function(t){var n=e(t.target).closest("[data-scroll-nav]").attr("data-scroll-nav")||e(t.target).closest("[data-scroll-goto]").attr("data-scroll-goto");o(parseInt(n))};var a=function(t){var r=t.which;if(e("html,body").is(":animated")&&(r==n.upKey||r==n.downKey)){return false}if(r==n.upKey&&i>0){o(parseInt(i)-1);return false}else if(r==n.downKey&&i<s){o(parseInt(i)+1);return false}return true};var f=function(t){if(n.onPageChange&&t&&i!=t)n.onPageChange(t);i=t;e("[data-scroll-nav]").removeClass(n.activeClass);e("[data-scroll-nav="+t+"]").addClass(n.activeClass)};var l=function(){var t=e(window).scrollTop();var r=e("[data-scroll-index]").filter(function(r,i){return t>=e(i).offset().top+n.topOffset&&t<e(i).offset().top+n.topOffset+e(i).outerHeight()});var i=r.first().attr("data-scroll-index");f(i)};e(window).on("scroll",l).scroll();e(window).on("keydown",a);e("body").on("click","[data-scroll-nav], [data-scroll-goto]",function(e){e.preventDefault();u(e)})}})(jQuery)  
      .JS do Botão Back to top (backtotop.js)

       
      jQuery(window).scroll(function(){ if(jQuery(window).scrollTop()<50){ jQuery('#rocketmeluncur').slideUp(500); }else{ jQuery('#rocketmeluncur').slideDown(500); } var ftrocketmeluncur = jQuery("#ft")[0] ? jQuery("#ft")[0] : jQuery(document.body)[0]; var scrolltoprocketmeluncur = $('rocketmeluncur'); var viewPortHeightrocketmeluncur = parseInt(document.documentElement.clientHeight); var scrollHeightrocketmeluncur = parseInt(document.body.getBoundingClientRect().top); var basewrocketmeluncur = parseInt(ftrocketmeluncur.clientWidth); var swrocketmeluncur = scrolltoprocketmeluncur.clientWidth; if (basewrocketmeluncur < 1000) { var leftrocketmeluncur = parseInt(fetchOffset(ftrocketmeluncur)['left']); leftrocketmeluncur = leftrocketmeluncur < swrocketmeluncur ? leftrocketmeluncur * 2 - swrocketmeluncur : leftrocketmeluncur; scrolltoprocketmeluncur.style.left = ( basewrocketmeluncur + leftrocketmeluncur ) + 'px'; } else { scrolltoprocketmeluncur.style.left = 'auto'; scrolltoprocketmeluncur.style.right = '10px'; } }) jQuery('#rocketmeluncur').click(function(){ jQuery("html, body").animate({ scrollTop: '0px',display:'none'},{ duration: 600, easing: 'linear' }); var self = this; this.className += ' '+"launchrocket"; setTimeout(function(){ self.className = 'showrocket'; },800) });

      Ficaria inteiramente grato se alguém pudesse me ajudar nessa.
      Um forte abraço a toda comunidade.


       
    • Por Sapinn
      Quero que quando o usuario chegue em uma parte do menu site ele o menu fique fixo no topo da pagina. Como fazer isso???
    • Por FabianoSouza
      Pessoal, tenho uma modal cuja altura é variável.
      Aí preciso que, caso a modal atinja altura maior do que a tela, apareça a barra de rolagem vertical NA JANELA MÃE, não na DIV que que mostra o conteúdo.
      Igual ao Trello (vejam a imagem).

    • Por Robson Tenorio Henriques
      Olá pessoal, estou com um projeto onde no mesmo existe 11 categorias e vários modelos para cada categoria, as categorias e modelos são apresentadas por meio de imagens em miniaturas (OBS: as imagens são dispostas em duas colunas), onde ao clicar numa categoria abre os modelos existentes, esta parte esta funcionando perfeitamente, porém o que necessito fazer é limitar a exibição das categorias e modelo para uma área de no máximo 1000px, que seria umas 6 ou 7 imagens aproximadamente e adicionar botões de navegação para passar entre os itens..
       
      Abaixo segue o código da página:
      <div id="menu" class="pecasmain"> <input type="hidden" id="idlinha" name="idlinha" value="0"> <input type="hidden" id="idmodelo" name="idmodelo" value="0"> <div id="menuLinhas" class="menuLinhas"> <h3>LINHAS</h3> <a id="linha1" idreg="225" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000000225_01_gd.jpg" /> <span class="linknaoselecionado">Adubadoras Pendulares</span> </a> <a id="linha2" idreg="62" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000000062_01_gd.jpg" /> <span class="linknaoselecionado">Mini Pá Carregadeira e Mini Retro Escavadeira</span> </a> <a id="linha3" idreg="63" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000000063_01_gd.jpg" /> <span class="linknaoselecionado">Manejo de solo e trituração de poda: </span> </a> <a id="linha4" idreg="61" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000000061_01_gd.jpg" /> <span class="linknaoselecionado">Adubadoras mono disco</span> </a> <a id="linha5" idreg="242" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000000242_01_gd.jpg" /> <span class="linknaoselecionado">Recolhedora de terreiro</span> </a> <a id="linha6" idreg="246" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000000246_01_gd.jpg" /> <span class="linknaoselecionado">Enlerador e soprador</span> </a> <a id="linha7" idreg="59" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000000059_01_gd.jpg" /> <span class="linknaoselecionado">Adubadoras de 2 discos</span> </a> <a id="linha8" idreg="10419" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000010419_01_gd.jpg" /> <span class="linknaoselecionado">Adubadora cafeeira e citrus</span> </a> <a id="linha9" idreg="65" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000000065_01_gd.jpg" /> <span class="linknaoselecionado">Recolhedora e abonadora de chão</span> </a> <a id="linha10" idreg="9039" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000009039_01_gd.jpg" /> <span class="linknaoselecionado">Podadora</span> </a> <a id="linha11" idreg="16321" href="JavaScript: void(0);" class="linklinha"> <img src="../imgs_categorias/img_0000016321_01_gd.jpg" /> <span class="linknaoselecionado">Braço de retro agrícola</span> </a> </div> <div id="menuModelos0" class="menuModelos"> <h3>MODELOS</h3> <span>Selecione uma LINHA no menu à esquerda.</span> </div> <div id="menuModelos225" class="menuModelos" style="display: none;"> <h3>Adubadoras Pendulares</h3> <a href="#" id="modelo1" idreg="69" class="linkmodelo"> <img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000069_01_gd.jpg" /> <span class="linknaoselecionado"> PS 203</span></a> <a href="#" id="modelo2" idreg="232" class="linkmodelo"><img id="img2" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000232_01_gd.jpg" /> <span class="linknaoselecionado"> PS / PSPP 303</span></a> <a href="#" id="modelo3" idreg="235" class="linkmodelo"><img id="img3" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000235_01_gd.jpg" /> <span class="linknaoselecionado">PS / PSPP 403</span></a> <a href="#" id="modelo4" idreg="236" class="linkmodelo"><img id="img4" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000236_01_gd.jpg" /> <span class="linknaoselecionado">PS 503</span></a> <a href="#" id="modelo5" idreg="237" class="linkmodelo"><img id="img5" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000237_01_gd.jpg" /> <span class="linknaoselecionado">PS / PSPP 603</span></a> <a href="#" id="modelo6" idreg="233" class="linkmodelo"><img id="img6" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000233_01_gd.jpg" /> <span class="linknaoselecionado">PS 753</span></a> <a href="#" id="modelo7" idreg="234" class="linkmodelo"><img id="img7" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000234_01_gd.jpg" /> <span class="linknaoselecionado">PS 953</span></a> <a href="#" id="modelo8" idreg="238" class="linkmodelo"><img id="img8" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000238_01_gd.jpg" /> <span class="linknaoselecionado">PS 1153</span></a> <a href="#" id="modelo9" idreg="239" class="linkmodelo"><img id="img9" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000239_01_gd.jpg" /> <span class="linknaoselecionado">PS 1353</span></a> <a href="#" id="modelo10" idreg="240" class="linkmodelo"><img id="img10" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000240_01_gd.jpg" /> <span class="linknaoselecionado">PS 1553T</span></a> <a href="#" id="modelo11" idreg="16808" class="linkmodelo"><img id="img11" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000016808_01_gd.jpg" /> <span class="linknaoselecionado">Pendulum</span></a> </div> <div id="menuModelos62" class="menuModelos" style="display: none;"> <h3>Mini Pá Carregadeira e Mini Retro Escavadeira</h3> <a href="#" id="modelo1" idreg="88" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000088_01_gd.jpg" /> <span class="linknaoselecionado">PX 04 Mini Pá carregadeira</span></a> <a href="#" id="modelo2" idreg="89" class="linkmodelo"><img id="img2" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000089_01_gd.jpg" /> <span class="linknaoselecionado">RX 04 Mini Retro escavadeira</span></a> </div> <div id="menuModelos63" class="menuModelos" style="display: none;"> <h3>Manejo de solo e trituração de poda: </h3> <a href="#" id="modelo1" idreg="86" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000086_01_gd.jpg" /> <span class="linknaoselecionado">TRSL 90</span></a> <a href="#" id="modelo2" idreg="87" class="linkmodelo"><img id="img2" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000087_01_gd.jpg" /> <span class="linknaoselecionado">TRSL 90E</span></a> <a href="#" id="modelo3" idreg="251" class="linkmodelo"><img id="img3" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000251_01_gd.jpg" /> <span class="linknaoselecionado">TRV 100 </span></a> <a href="#" id="modelo4" idreg="252" class="linkmodelo"><img id="img4" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000252_01_gd.jpg" /> <span class="linknaoselecionado">TRV 120</span></a> <a href="#" id="modelo5" idreg="16615" class="linkmodelo"><img id="img5" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000016615_01_gd.jpg" /> <span class="linknaoselecionado">TRL 120</span></a> <a href="#" id="modelo6" idreg="258" class="linkmodelo"><img id="img6" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000258_01_gd.jpg" /> <span class="linknaoselecionado">TRL 140</span></a> <a href="#" id="modelo7" idreg="259" class="linkmodelo"><img id="img7" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000259_01_gd.jpg" /> <span class="linknaoselecionado">TRL 160</span></a> <a href="#" id="modelo8" idreg="260" class="linkmodelo"><img id="img8" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000260_01_gd.jpg" /> <span class="linknaoselecionado">TRL 180</span></a> <a href="#" id="modelo9" idreg="261" class="linkmodelo"><img id="img9" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000261_01_gd.jpg" /> <span class="linknaoselecionado">TRL 200</span></a> <a href="#" id="modelo10" idreg="262" class="linkmodelo"><img id="img10" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000262_01_gd.jpg" /> <span class="linknaoselecionado">TRL 220</span></a> <a href="#" id="modelo11" idreg="254" class="linkmodelo"><img id="img11" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000254_01_gd.jpg" /> <span class="linknaoselecionado">TRP 120</span></a> <a href="#" id="modelo12" idreg="255" class="linkmodelo"><img id="img12" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000255_01_gd.jpg" /> <span class="linknaoselecionado">TRP 160H</span></a> <a href="#" id="modelo13" idreg="253" class="linkmodelo"><img id="img13" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000253_01_gd.jpg" /> <span class="linknaoselecionado">TRLA 180 </span></a> <a href="#" id="modelo14" idreg="15868" class="linkmodelo"><img id="img14" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000015868_01_gd.jpg" /> <span class="linknaoselecionado">TRLA 140</span></a> <a href="#" id="modelo15" idreg="257" class="linkmodelo"><img id="img15" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000257_01_gd.jpg" /> <span class="linknaoselecionado">TRS 360</span></a> <a href="#" id="modelo16" idreg="256" class="linkmodelo"><img id="img16" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000256_01_gd.jpg" /> <span class="linknaoselecionado">TRC 220</span></a> <a href="#" id="modelo17" idreg="10327" class="linkmodelo"><img id="img17" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000010327_01_gd.jpg" /> <span class="linknaoselecionado">TRSL 1,50</span></a> <a href="#" id="modelo18" idreg="2947" class="linkmodelo"><img id="img18" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000002947_01_gd.jpg" /> <span class="linknaoselecionado">TRL 140 RS</span></a> </div> <div id="menuModelos61" class="menuModelos" style="display: none;"> <h3>Adubadoras mono disco</h3> <a href="#" id="modelo1" idreg="85" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000085_01_gd.jpg" /> <span class="linknaoselecionado">Giro 400/600</span></a> <a href="#" id="modelo2" idreg="81" class="linkmodelo"><img id="img2" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000081_01_gd.jpg" /> <span class="linknaoselecionado">Giro 400/600 INOX</span></a> </div> <div id="menuModelos242" class="menuModelos" style="display: none;"> <h3>Recolhedora de terreiro</h3> <a href="#" id="modelo1" idreg="243" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000243_01_gd.jpg" /> <span class="linknaoselecionado">VRC 1600</span></a> <a href="#" id="modelo2" idreg="10245" class="linkmodelo"><img id="img2" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000010245_01_gd.jpg" /> <span class="linknaoselecionado">Varredor Hidraulico 2.6 Para Terreiro de Café</span></a> <a href="#" id="modelo3" idreg="10421" class="linkmodelo"><img id="img3" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000010421_01_gd.jpg" /> <span class="linknaoselecionado">Varredor Hidráulico 3.6 Para Terreiro de Café</span></a> <a href="#" id="modelo4" idreg="13270" class="linkmodelo"><img id="img4" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000013270_01_gd.jpg" /> <span class="linknaoselecionado">Varredor Hidráulico 2.6 Para Terreiro de Café Com Pistão Hid</span></a> <a href="#" id="modelo5" idreg="13693" class="linkmodelo"><img id="img5" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000013693_01_gd.jpg" /> <span class="linknaoselecionado">Varredor Hidráulico 3.6 Para Terreiro de Café Com Pistão Hid</span></a> </div> <div id="menuModelos246" class="menuModelos" style="display: none;"> <h3>Enlerador e soprador</h3> <a href="#" id="modelo1" idreg="13885" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000013885_01_gd.jpg" /> <span class="linknaoselecionado">Varrecafé Traseiro Simples Geração 2C </span></a> <a href="#" id="modelo2" idreg="14055" class="linkmodelo"><img id="img2" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000014055_01_gd.jpg" /> <span class="linknaoselecionado">Varrecafé Traseiro Duplo Geração 2C</span></a> <a href="#" id="modelo3" idreg="14491" class="linkmodelo"><img id="img3" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000014491_01_gd.jpg" /> <span class="linknaoselecionado">Varrecafé Duplo G2 Caixa Dupla</span></a> <a href="#" id="modelo4" idreg="14351" class="linkmodelo"><img id="img4" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000014351_01_gd.jpg" /> <span class="linknaoselecionado">Varrecafé Simples G2 Caixa Dupla </span></a> <a href="#" id="modelo5" idreg="247" class="linkmodelo"><img id="img5" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000247_01_gd.jpg" /> <span class="linknaoselecionado">Cleaner café/ RTF Dual</span></a> <a href="#" id="modelo6" idreg="248" class="linkmodelo"><img id="img6" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000248_01_gd.jpg" /> <span class="linknaoselecionado">Cleaner maçã / citrus</span></a> <a href="#" id="modelo7" idreg="9042" class="linkmodelo"><img id="img7" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000009042_01_gd.jpg" /> <span class="linknaoselecionado">Soprador</span></a> </div> <div id="menuModelos59" class="menuModelos" style="display: none;"> <h3>Adubadoras de 2 discos</h3> <a href="#" id="modelo1" idreg="74" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000074_01_gd.jpg" /> <span class="linknaoselecionado">TDS 750</span></a> <a href="#" id="modelo2" idreg="75" class="linkmodelo"><img id="img2" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000075_01_gd.jpg" /> <span class="linknaoselecionado">TDS 950</span></a> <a href="#" id="modelo3" idreg="76" class="linkmodelo"><img id="img3" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000076_01_gd.jpg" /> <span class="linknaoselecionado">TDS 1150</span></a> <a href="#" id="modelo4" idreg="73" class="linkmodelo"><img id="img4" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000073_01_gd.jpg" /> <span class="linknaoselecionado">TDS 1350</span></a> <a href="#" id="modelo5" idreg="72" class="linkmodelo"><img id="img5" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000072_01_gd.jpg" /> <span class="linknaoselecionado">TDS 1550</span></a> <a href="#" id="modelo6" idreg="71" class="linkmodelo"><img id="img6" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000000071_01_gd.jpg" /> <span class="linknaoselecionado">Vibraflow II</span></a> </div> <div id="menuModelos10419" class="menuModelos" style="display: none;"> <h3>Adubadora cafeeira e citrus</h3> <a href="#" id="modelo1" idreg="10420" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000010420_01_gd.jpg" /> <span class="linknaoselecionado">MX 2100</span></a> </div> <div id="menuModelos65" class="menuModelos" style="display: none;"> <h3>Recolhedora e abonadora de chão</h3> <a href="#" id="modelo1" idreg="9343" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000009343_01_gd.jpg" /> <span class="linknaoselecionado">Catacafé </span></a> </div> <div id="menuModelos9039" class="menuModelos" style="display: none;"> <h3>Podadora</h3> <a href="#" id="modelo1" idreg="9040" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000009040_01_gd.jpg" /> <span class="linknaoselecionado">Podadora</span></a> </div> <div id="menuModelos16321" class="menuModelos" style="display: none;"> <h3>Braço de retro agrícola</h3> <a href="#" id="modelo1" idreg="16322" class="linkmodelo"><img id="img1" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000016322_01_gd.jpg" /> <span class="linknaoselecionado">BRM BRAÇO MÓVEL </span></a> <a href="#" id="modelo2" idreg="16423" class="linkmodelo"><img id="img2" style="cursor: pointer;" src="../../imgs_produtos/pt/img_0000016423_01_gd.jpg" /> <span class="linknaoselecionado">BRF BRAÇO FIXO </span></a> </div> <div id="pecasHome" class="pecasConteudo"> <img src="../img/pecas.jpg" /> <img src="../img/diversas-pecas.jpg" /> <div id="desconto"> <p class="desconto"> Desconto de 3% para compras efetuadas em nosso site. </p> </div> </div> <div id="pecasConteudo" class="pecasConteudo" style="display: none;"></div> <br style="clear: both;"/> <iframe id="frameprocessa" name="frameprocessa" style="width: 0px; height: 0px; visibility: hidden; "></iframe> <!--<script src="../js/jquery-3.4.1.min.js"></script>--> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script language="Javascript"> $(document).ready(function() { $(".linklinha").click(function(e) { $("#menuLinhas > a > span").removeClass ( 'linkselecionado' ); $("#menuLinhas > a > span").addClass ( 'linknaoselecionado' ); $(this).find('span').addClass('linkselecionado'); var idreg = parseInt($(this).attr("idreg")); // Esconde Todas Divs Modelos $.each($(".menuModelos"), function(e) { $(this).hide(); }); // Exibe Div Modelo $("#menuModelos"+idreg).show(); //console.log("idreg= " + idreg); $("#menuModelos"+idreg+" > a > span").removeClass ( 'linkselecionado' ); $("#menuModelos"+idreg+" > a > span").addClass ( 'linknaoselecionado' ); // Ajusta Foco $("#menuModelos"+idreg+" #modelo1").focus(); $("#pecasConteudo").hide(); $("#pecasHome").show(); // Seta Deselecionada Modelo $("#idlinha").val(idreg); $("#idmodelo").val(0); }); $(".linkmodelo").click(function(e) { var idlinha = parseInt($("#idlinha").val()); $("#menuModelos"+idlinha+" > a > span").removeClass ( 'linkselecionado' ); $("#menuModelos"+idlinha+" > a > span").addClass ( 'linknaoselecionado' ); $(this).find('span').addClass('linkselecionado'); $("#pecasHome").hide(); //alert('Vai carregar DETALHES do MODELO IDREG: ' + $(this).attr("idreg")); $("#pecasConteudo").load( "carrega_pecas_detalhe.html?id="+ $(this).attr("idreg"), function( response, status, xhr ) { if ( status == "error" ) { console.log("#error" + xhr.status + " " + xhr.statusText ); } }); $("#pecasConteudo").show(); }); function initPage() { console.log('Carregou Linhas OK !'); var idlinha = parseInt($("#idlinha").val()); var idmodelo = parseInt($("#idmodelo").val()); // Esconde Todas Divs Modelos $.each($(".menuModelos"), function(e) { $(this).hide(); }); // Exibe Div Modelo $("#menuModelos"+idlinha).show(); } initPage(); }); </script> Se alguém puder me ajudar, pois esse pequeno detalhe ta me tomando um grande tempo e atrasando o projeto.
×

Informação importante

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