-
Similar Content
-
By Sapinn
Opa galera tudo firmesa? Então, tenho um codigo que faz uma barra aparecer toda vez que eu role a pagina até um certo ponto e tudo funciona normal. Eu gostaria de saber se tem como fazer uma transição nessa barra para ele ir aparecendo devagarzinho com a opacidade em 0 e vai subindo até chegar a 1 coisa de um 0.8s. Não sei como fazer ou se tem como fazer preciso de ajuda.
Codigo js
window.onscroll = function(){
var top = window.pageXOffset || document.documentElement.scrollTop
var barra = document.querySelector(".barra");
if(top > 900){
barra.style.display = 'flex';
//aqui tentei adicionar uma class direto do css para fazer o efeito transition mas sem sucesso.
barra.classList.add('transition');
}else{
barra.style.display = 'none';
}
}
Codigo css
.barra{
width: 100%;
height: 70px;
background-color: #090b13;
display: none;
justify-content: space-between;
position: fixed;
opacity: 0;
}
.transition{
transition: 1s;
opacity: 0.7;
}
codigo HTML
<div class="barra" >
<img src="assets/images/logo-nopad.svg" alt="">
<button class="botao-assinatura-header">Assine Agora</button>
</div>
-
By henriquers
Estou com um problema com o Select2, ele tem um campo de busca mas não esta filtrando corretamente e não estou entendo o motivo, sem utilizar o AJAX colocando os options manualmente ele funciona corretamente, mas trazendo os dados via AJAX ele não funciona o campo de busca.
Se aguem poder me dar uma luz agradeço a ajuda.
Nessa imagem estou tentando filtrar apenas para os itens que tenha LUVA na descrição, mas não funciona, posso colocar qual quer coisa que ele não faz o filtro
Abaixo segue meu codigo
HTML
<!DOCTYPE HTML PUBLIC> <HTML> <HEAD> <TITLE> Select2 </TITLE> <link href="select2/select2.css" rel="stylesheet" type="text/css" /> <script src="https://code.jquery.com/jquery-latest.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/i18n/pt-BR.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.css" rel="stylesheet"/> <script> $(document).ready(function(){ $("#selUser").select2({ language: "pt-br", ajax: { url: "get_dados.php", type: "GET", dataType: 'json', delay: 200, data: function (params) { return { q: params.term, // search term page: params.page }; }, processResults: function (response) { return { results: response }; }, cache: true }, width: "20%", closeOnSelect: true, }); }); </script> </head> <body> <select id='selUser' style='width: 200px;'> <option value='0'>- Search user -</option> </select> </body> </html> get_dados.php
<?php include './conn_orcl.php'; $select="SELECT PRO_CODPRO PRODUTO,TRIM(PRO_DESCRI) DESCRICAO FROM F_PRODS WHERE PRO_LOCEST='ALMOX' AND PRO_STATUS = 'AT' ORDER BY DESCRICAO"; $parse=oci_parse($conn,$select); oci_execute($parse); $data = array(); while($row=oci_fetch_array($parse)){ $data[] = array("id"=>$row['PRODUTO'], "text"=>$row['PRODUTO']." - ".$row['DESCRICAO']); }; echo json_encode($data); ob_end_flush(); oci_free_statement($parse); oci_close($conn); ?>
-
By karleonel
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style type="text/css"> .conteudo{ text-align: justify-all; } .texto{ font-family: Arial, Helvetica, sans-serif; font-size: 12pt; font-weight: bold; text-align: justify; } .titulo{ text-align: center; } </style> </head> <body id="minhaPagina"> <div class="conteudo"> <h1 class="titulo"></h1> <p class="texto"></p> <label for="digite">Digite a palavra:</label> <input name="campo" type="text" size="20" maxlength="6" /><br><br> <button type="button" onclick="VPalindromo('fcampo')" >Validar Palíndromo</button> </div> <script> function VPalindromo(str) { //var str = document.getElementByID("fcampo").value; var er = /[\W]/g var smallStr = str.toLowerCase().replace(er, ""); var x = smallStr.split("").reverse().join(""); if (x == smallStr) { alert("É um palindromo.") } else{ alert("Não é um palindromo.") } } </script> </body> </html> Pessoal,
Eu fiz este código utilizando expressões regulares mas ao tentar validar ele sempre dá reposta como falsa.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style type="text/css"> .conteudo{ text-align: justify-all; } .texto{ font-family: Arial, Helvetica, sans-serif; font-size: 12pt; font-weight: bold; text-align: justify; } .titulo{ text-align: center; } </style> </head> <body id="minhaPagina"> <div class="conteudo"> <h1 class="titulo"></h1> <p class="texto"></p> <label for="digite">Digite a palavra:</label> <input name="campo" id="fcampo" type="text" size="20" maxlength="6" /><br><br> <button type="button" onclick="VPalindromo()" >Validar Palíndromo</button> </div> <script> function VPalindromo(str) { var er = /[\W]/g var smallStr = str.toLowerCase().replace(er, ""); var x = smallStr.split("").reverse().join(""); if (x == smallStr) return true; return false; } </script> </body> </html>
-
By joagostini
Olá, sou iniciante, e estou fazendo, como exercício, o jogo da velha. 'Desenvolvi' uma rotina de escolha de nível do jogo (serão 3 níveis) que deve aguardar a escolha do usuário para o programa prosseguir. Mas acho que não entendi direito como o javascript funciona, pois o que fiz não funciona e não encontrei uma solução (talvez não saíba como pesquisar corretamente o assunto na web).
O começo do HTML (que é pouco) onde está um select para escolha do nível é este:
<body> <div id="dvmenu"> <button onclick="iniciar()">Iniciar Jogo</button> <p><br></p> <div id="dvQuemComeca"> <label for="nivel">Escolha o nivel:</label> <select id="nivel" onChange='atualiza()'> <option value=0 selected>Escolha um nível</option> <option value=1>Nível 1 - Brincadeira</option> <option value=2>Nivel 2 - Surpresa</option> <option value=3>Nível 3 - Desafio</option> </select> </div> <div id="jogador" class="jogador"></div> <div id="vencedor" class="jogador"></div> </div>
O código JS é este:
//INÍCIO VEM DE LOAD function iniciar() { casela = document.querySelectorAll('div[id^="p"]'); for (let cas of casela) { cas.innerHTML = ''; } for (let i = 0; i < 9; i++){ tab = tab; } console.log(tab); nivel = 0; msg = ''; qtosLancesJog = 0; sorteiaJogador(); //até aqui funcionou direito } //-------------------------------------------------------------------- //ESCOLHA DO NÍVEL DO JOGO function atualiza(){ let selecao = document.querySelector('#nivel'); let opcao = selecao.options[selecao.selectedIndex]; return opcao.value; } //-------------------------------------------------------------------- //SORTEIA QUEM VAI COMEÇAR JOGANDO //função para definir o jogador que inicia o tab function sorteiaJogador() {//funcionou direito let quemComeca = parseInt(Math.floor(Math.random() * 2)); if (quemComeca == 0) { msg = 'Computador'; //setTimeout(lanceCpu, 2000);//dá um intervalo antes do computador realizar o 1 lance lanceCpu(); } else msg = 'Humano';//neste caso a rotina espera que o jogador clique no tabuleiro, qdo roda a função lancetab(pos) lanceHumano(); document.querySelector('#jogador').innerHTML = `<br>O ${msg} começa!`; } //-------------------------------------------------------------------- //ESCOLHA RANDÔMICA, NIVEL = 1, Da POSIÇÃO DO LANCE DA CPU NO tabULEIRO function jogouCpu(){//funcionou direito //nível 1 modo randômico pos = Math.floor(Math.random() * 9); return pos; } //função humana function lanceHumano(){ console.log('Estou na função humana'); do { nivel = atualiza(); console.log(nivel); } while (nivel === 0); console.log(nivel + ' passei direto'); }
O problema está nesse do...while da function lanceHumano(). Segundo entendi, ele prosseguiria apenas quando nivel!== 0, caso contrário, ficaria 'preso' até o momento que o usuário escolhesse uma das opções. Pelo HTML percebesse que setei o select para value=0. Mas ele nem se dá ao trabalho de esperar um miléssimo de segundo, segue em frente com o valor que tiver, no caso 0. O while não tem efeito. Essa minha perspectiva está errada? Se sim, o que fazer? (paradigma funcional, await?) Obrigado.
P.S.. No código tem uns conole.logs que servem watch-dogs para ajudar a entender por onde vão as rotinas.
-
By Ninja2112
Ola pessoal....estou c o seguinte problema: Tenho uma página .jsp com uns botões
e querendo preenche-los durante o carregamento. De acordo com o value, querendo
colorir de uma forma diferente. Alguma idéia ? Estou tentando assim:
value="<%=consultarStatusSemana(dist1[i],vetorsematual[j])%>" e como posso chamar uma função q de os estilos de acordo ??
-
