Ir para conteúdo

Pesquisar na Comunidade

Mostrando resultados para as tags ''JavaScript''.

  • Pesquisar por Tags

    Digite tags separadas por vírgulas
  • Pesquisar por Autor

Tipo de Conteúdo


Todas as áreas do Fórum

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Desenvolvimento Web
    • Desenvolvimento frontend
    • Javascript
    • PHP
    • Ruby
    • Python
    • Java
    • .NET
    • Docker, Kubernets e outros ambientes
    • Desenvolvimento com Wordpress
    • Desenvolvimento de apps
    • Desenvolvimento ágil
    • Desenvolvimento de Games
    • Banco de Dados
    • Design e UX
    • Algoritmos & Outras Tecnologias
  • Entretenimento e uso pessoal
    • Segurança & Malwares
    • Geral
    • Boteco iMasters

Encontrar resultados em...

Encontrar resultados que...


Data de Criação

  • Início

    FIM


Data de Atualização

  • Início

    FIM


Filtrar pelo número de...

Data de Registro

  • Início

    FIM


Grupo


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Encontrado 797 registros

  1. dmelo

    Palavra em modo sequencial, não aleatório

    Já fiz várias pesquisas na internet mas não encontrei a resposta. Espero que alguém me ajude! O código abaixo está funcionando, mas eu gostaria que ao invés de ser preenchido aleatóriamente seja de forma sequencial, ou seja, 1, 2, 3, 4 ... var amostra = new Array("primeiro", "segundo", "terceiro", "quarto"); var lista = new Array(); while( lista.length < 1 ){ tamanho = amostra.length; aleatorio = Math.floor( Math.random() * tamanho ); lista.push( amostra.splice(aleatorio,1) );} setTimeout(function(){input.value = lista;}, 1000);
  2. Iai galera beleza? Uma duvida boba mais que recorre muito. Tenho um site rodando em PHP e gostaria de saber como fazer para que o usuário permaneça logado mesmo, por exemplo, se ele fechasse o navegador. E também queria saber como dar logoff depois de um longo período de tempo sem ele fazer nada, ou seja, por inatividade. Quero aproveitar esse tópico pra pergunta também como fazer para o usuário ficar logado direto? Vi em alguns sites uma opção que você marca e assim que entra na pagina inicial já vai direto para a pagina com seus dados sem precisar ter que preencher um form de login como isso é feito? To fazendo esse tópico porque ja pesquisei em um monte de lugares e não encontrei uma resposta boa, além disso vi que outra pessoas possuem a mesma duvida e talvez esse tópico possa ajuda-las futuramente ou até eu mesmo.
  3. Olá pessoal, tudo bem? Tenho um sistema do qual traz em um combobox a relação de grades (masculino, feminino, etc) do banco de dados e a mesma tabela tem chave estrangeira na tabela dos tamanhos. Quando seleciono uma grade, os tamanhos referentes a essa grade aparecem. O problema está quando clico em Incluir nova cor e seleciono uma outra grade. Os tamanhos da nova grade selecionada aparece também na grade já selecionada anteriormente, ou seja, o valor acaba se duplicando. O que está acontecendo é que valor chega até o JQuery, porém quando passo o valor por: url: '<?php echo $caminhoAbsoluto; ?>/listar.php?v='+valorEscolhido, E pego pelo código abaixo: $grades = $_REQUEST["v"]; echo $metodos->listarTamanhos($grades); Ele pega o último valor selecionado, porém duplica conforme o anexo. Vejam: public function listarTamanhos($grades) { $visualizar = '<table class="table table-bordered"> <tr> <td style="text-align: center; background-color: #367FA9; color: #FFF; font-weight: bold">Tamanho</td> <td style="text-align: center; background-color: #367FA9; color: #FFF; font-weight: bold">Quantidade</td> <td style="text-align: center; background-color: #367FA9; color: #FFF; font-weight: bold">EAN</td> </tr>'; $sql = mysqli_query($this->conexao,"SELECT * FROM loja_tamanho_grades WHERE IdGrades = '".$grades."';"); //while($isfast = mysqli_fetch_object($sql)) // $i = 0; while($isfast = mysqli_fetch_assoc($sql)) { $sqlTamanhos = mysqli_query($this->conexao,"SELECT * FROM loja_tamanhos WHERE IdTamanhos = '".$isfast["IdTamanhos"]."';"); $isfastTamanhos = mysqli_fetch_assoc($sqlTamanhos); $visualizar .= '<tr> <td style="font-weight: bold; text-align: center; font-size: 20px; font-style:Arial">'.$isfastTamanhos["Tamanhos"].'</td> <td><input type="number" class="form-control" min="0" oninput="this.value = Math.abs(this.value)" value="0"></td> <td><input type="text" class="form-control" maxlength="17" style="width: 100%"></td> </tr>'; $visualizar .= '<tr>'; // $visualizar .= '<td colspan="3"><div class="mostrarGrades_'.$i.'"></div></td>'; $visualizar .= '</tr>'; // $i++; } // $visualizar .= '<tr><td colspan="3"><div class="mostrarGrades"></div></td></tr>'; //$visualizar .= '</table>'; //return $visualizar; $visualiza[] = $visualizar; return json_encode($visualiza); } Como faço para que não tenha duplicidade. Veja abaixo o restante do código: <table width="100%" > <tr class="linhas"> <td> <table class="table table-bordered"> <tr> <td style="text-align: center; background-color: #367FA9; color: #FFF; font-weight: bold">Código de cores</td> <td style="text-align: center; background-color: #367FA9; color: #FFF; font-weight: bold">Cor Básica</td> <td style="text-align: center; background-color: #367FA9; color: #FFF; font-weight: bold">Grades</td> </tr> <tr> <td style="text-align: center; width: 40%"><input type="text" class="form-control" placeholder="Referência"></td> <td style="text-align: center; width: 30%"> <select name="CoresBasicas" class="form-control"> <?php echo $metodos->comboCores($key); ?> </select> </td> <td style="text-align: left;"> <select name="Grades" class="form-control grades" style="width: 100%"> <?php echo $metodos->comboGrades(); ?> </select> </td> </tr> <tr> <td colspan="3"> <?php //echo $metodos->listarTamanhos(); ?> <div class="mostrarGrades"></div> </td> </tr> <tr> <td colspan="3" class="text-left"> <label for='files' class="upload">Selecionar fotos <i class="fa fa-plus-circle fa-lg" aria-hidden="true"></i></label> <input id='files' type='file' name="Fotos[]" multiple> </td> </table> Jquery $(function () { function removeCampo() { $(".removerCampo").unbind("click"); $(".removerCampo").bind("click", function () { if($("tr.linhas").length > 1){ $(this).parent().parent().remove(); } }); } $(".adicionarCampo").click(function () { novoCampo = $("tr.linhas:first").clone(); //novoCampo.find("input").val(""); novoCampo.find('input[type="text"]').val(""); novoCampo.find('select').val(""); //novoCampo.find('input[type="radio"]').prop('selected', false); novoCampo.insertAfter("tr.linhas:last"); removeCampo(); }); }); $(document).ready( function (){ $(document).on('change', '.grades', function(){ valorEscolhido = $(this).find('option:selected').val(); $.ajax({ type:'post', dataType: 'json', url: '<?php echo $caminhoAbsoluto; ?>/listar.php?v='+valorEscolhido, success: function(dados){ /* for(var i=0;dados.length>i;i++){ $('.mostrarGrades').html(dados[i]); } */ $('.mostrarGrades').html(dados); } }); }); }); Obrigado!
  4. everton_araujo

    Mudar CSS de acordo com os parâmetros

    Olá Pessoal boa noite. Preciso da ajuda de vcs para mudar o tamanho de uma imagem dinamicamente. O parâmetro a ser utilizado é a quantidade de dias que se passaram. Esta é a parte do cálculo de dias que já está funcionando: function r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()} r(function(){ var dataini = document.querySelectorAll('#DataIni3') dataini = dataini[0].querySelectorAll('div'); dataini = dataini[0].querySelectorAll('span'); dataini = dataini[0].innerHTML; var datafim = document.getElementById('datafim').innerHTML; var date1 = criarData(dataini); var date2 = criarData(datafim); const diffTime = (date2 - date1); const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)); document.getElementById('dias').innerHTML+= diffDays }); function criarData(str) { return new Date(str.substring(0, 4), str.substring(4, 6), str.substring(6, 8)); } Aqui é a parte que estou com dificuldade. Usar o valor que retornou de diffDays e mudar o heigth utilizando o if: var v1 = diffDays; function mudarVela() { if (v1 == "2") { document.getElementById("candle").style.height = "100px !important"; } else{ } } O Código completo: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script> function r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()} r(function(){ var dataini = document.querySelectorAll('#DataIni3') dataini = dataini[0].querySelectorAll('div'); dataini = dataini[0].querySelectorAll('span'); dataini = dataini[0].innerHTML; var datafim = document.getElementById('datafim').innerHTML; var date1 = criarData(dataini); var date2 = criarData(datafim); //const diffTime = Math.abs(date2 - date1); //return new Date(str.substring(0, 4), str.substring(4, 6)-1, str.substring(6, 8)); const diffTime = (date2 - date1); const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)); document.getElementById('dias').innerHTML+= diffDays }); function criarData(str) { return new Date(str.substring(0, 4), str.substring(4, 6), str.substring(6, 8)); } //mudar o height da vela var v1 = diffDays; function mudarVela() { if (v1 == "2") { document.getElementById("candle").style.height = "100px !important"; } else{ } } </script> <div id="dataini"></div> <div id="datafim">20200618</div> <div id="dias">Dias: </div> Agradeço a atenção de todos.
  5. diovanedm

    Como importar um arquivo no node

    Gostaria de dar continuação ao codigo no arquivos tables.js, não estou sabendo como fazer isso connection.js const Sequelize = require('sequelize'); const sequelize = new Sequelize('caoperdido', 'root', '', { host: 'localhost', dialect: 'mysql' }); sequelize.authenticate().then(() => { console.log('Conexao estabelecida.'); }).catch(err => { console.error('Unable to connect to the database:', err); }); tables.js const User = sequelize.define('user', { // attributes firstName: { type: Sequelize.STRING, allowNull: false }, lastName: { type: Sequelize.STRING // allowNull defaults to true } }); User.sync({ force: true }).then(() => { return User.create({ firstName: 'Diovane', lastName: 'Maia' }); });
  6. Bom dia Galera!Fiz uma tela de cadastro na aplicação usando popup. Para cadastro tudo certo, pois não preciso recolher informações.Para fazer a tela de update, precisava que quando clicasse no link "Editar" ele buscasse a linha que eu cliquei para editar, porem em todas as tentativas de resolver isso ele pegou somente a primeira linha, fora que colocando o html do popup nessa ordem, ele foi parar la no canto direito.Segue o codigo de uma das tentativas :// Aqui é onde faço o select com todos ativos da carteira em tabela, e a DIV popup é exibida quando clico no link Editar. Não sei se é o lugar correto mas foi o mais proximo que consegui de fazer funcionar. Porem como ja explicado sempre pega o primeiro valor em vez da linha que cliquei{ativo.map(row => (<tr><input className="key" value={row._id} /><td>{row.ativo}</td><td>{row.quantidade}</td><td>{row.data_entrada}</td><td>{row.valor_entrada}</td><td>{row.data_saida}</td><td>{row.valor_saida}</td><td>R${row.valor_saida - row.valor_entrada}</td><td><a onClick={edit}>Editar</a></td><div className="popupedit"><div className="popupedit-content"><img src={close} alt="close" onClick={fechar} className="close" width="20px" height="20px"/><center><input type="text" placeholder="Ativo"></input><input type="text" placeholder="Lotes"></input><div className="datacompra"><input type="date" placeholder="Data da Compra" className="data"></input><input type="checkbox" className="check"></input><label className="check">Hoje</label></div><input type="text" placeholder="Valor da Compra"></input><div className="datacompra"><input type="date" placeholder="Data da Compra" className="data"></input><input type="checkbox" className="check"></input><label className="check">Hoje</label></div><input type="text" placeholder="Valor da Venda"></input> </center><button className="button">Adicionar</button></div></div></tr>// função que chama exibi o popupfunction edit(){document.querySelector(".popupedit").style.display = "flex";}
  7. asacap1000

    Executar um form assim que o campo for preenchido

    Salve Galera!! Estou com um problema que acredito que seja muito facil mas não estou conseguindo colocar no código. Tenho um formulário simples onde temos apenas um campo a ser preenchido, input file. estarei utilizando ele no celular para fotos de processos de conferência. O que preciso é que assim que constar dados no campo ele automaticamente executa o form para salvar. segue script; <form name="form" id="form"class="form-horizontal" action="" method="post"> <div class="form-group form-group-lg"> <div class="col-sm-12"> <input id="foto" name="foto" hidden="1" value="<?=$prot_foto?>" type="text" maxlength="200" > <input id="lote" name="lote" hidden="1" value="<?=$lote?>" type="text" maxlength="200" > <label for='selecaoarquivo' ><figure><svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="50" height="40" viewBox="0 0 512.000000 392.000000" preserveAspectRatio="xMidYMid meet"> <g transform="translate(0.000000,392.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none"> <path d="M1970 3073 l-151 -163 681 0 682 0 -19 24 c-10 14 -70 85 -133 160 l-115 134 -397 4 -397 3 -151 -162z m710 17 l0 -60 -190 0 -190 0 0 60 0 60 190 0 190 0 0 -60z"/> <path d="M3370 3005 l0 -95 240 0 240 0 0 95 0 95 -240 0 -240 0 0 -95z"/> <path d="M1154 2955 l-1 -45 224 0 223 0 0 45 0 45 -222 0 -223 0 -1 -45z"/> <path d="M1105 2829 c-114 -19 -200 -64 -266 -137 -85 -94 -116 -191 -126 -384 l-6 -128 713 0 713 0 72 68 c122 117 239 184 386 223 69 19 109 23 224 22 121 0 152 -4 228 -27 48 -14 118 -42 156 -61 78 -39 205 -137 248 -189 l28 -36 433 0 432 0 0 118 c0 123 -20 234 -56 304 -47 94 -138 168 -254 210 l-65 23 -1405 1 c-773 1 -1427 -2 -1455 -7z"/> <path d="M2715 2207 c-212 -23 -436 -233 -475 -446 -14 -78 -12 -196 5 -270 43 -181 197 -344 384 -408 52 -18 89 -23 171 -23 179 0 297 47 415 165 116 115 175 256 175 415 0 232 -158 458 -378 540 -68 26 -200 38 -297 27z"/> <path d="M712 1528 c5 -611 5 -613 63 -728 52 -102 125 -163 251 -207 l79 -28 1420 0 c1350 0 1423 1 1480 18 177 55 271 151 315 321 19 75 20 110 20 633 l0 553 -396 0 c-218 0 -394 -3 -392 -7 2 -5 15 -30 29 -58 54 -102 81 -210 86 -346 11 -261 -69 -472 -249 -651 -309 -311 -799 -341 -1140 -70 -167 133 -273 303 -314 503 -13 64 -15 114 -11 219 6 150 24 224 83 343 l34 67 -681 0 -680 0 3 -562z"/> </g> </svg></figure><h4>TIRAR FOTO</h4></label> <input type="file" id="selecaoarquivo" class="btn btn-danger" name="image[]" accept="image/*" capture="camera"> </div> </div><br> <p><br> <p> <button name="Cadastrar" id="cadastrar" value="Cadastrar" class="btn btn-success " type="Submit" onclick="javascript:document.getElementById('blanket').style.display = 'block';document.getElementById('aguarde').style.display = 'block';"><svg xmlns="http://www.w3.org/2000/svg" width="30" height="25" viewBox="0 0 20 17"><path d="M10 0l-5.2 4.9h3.3v5.1h3.8v-5.1h3.3l-5.2-4.9zm9.3 11.5l-3.2-2.1h-2l3.4 2.6h-3.5c-.1 0-.2.1-.2.1l-.8 2.3h-6l-.8-2.2c-.1-.1-.1-.2-.2-.2h-3.6l3.4-2.6h-2l-3.2 2.1c-.4.3-.7 1-.6 1.5l.6 3.1c.1.5.7.9 1.2.9h16.3c.6 0 1.1-.4 1.3-.9l.6-3.1c.1-.5-.2-1.2-.7-1.5z"/></svg><h4>SALVAR FOTO</h4></button> </form> Se puderem me dar uma força nisso agradeço imensamente!!!
  8. Sou formada em sistemas para internet, estou voltando aos estudos na área da programação; vamos lá, criei o código que ele sorteia um numero de 0 a 10,até ai blz, tudo normal,criei uma variável tentativas, só que ao invés do programa dar mais uma chance ao usuário, ele mostra 3 x a msg você errou. O código esta em txt tbm, desde já agradeço. <meta charset="UTF-8"> <input/> <!-- Caixa de texto--> <button>Compare com o meu segredo</button> <script> function pulaLinha() { document.write("<br>"); } function mostra(frase) { document.write(frase); pulaLinha(); } alert("Qual numero você acha que eu tenho no meu segredo?"); function verifica(){ // inicio da chave verifica var tentativas = 1; for (tentativas = 1; tentativas <= 3; tentativas++) { var segredo = Math.round(Math.random() * 10); var input = document.querySelector("input"); input.focus(); input.value = " "; if (input.value == segredo){ mostra("Você acertou"); break; }if (input.value != segredo) { alert("você errou"); alert("tente novamente"); } } mostra("Suas tentativas acabaram."); } // fecha chave verifica var button = document.querySelector("button"); button.onclick = verifica; </script>
  9. DinhoPHP

    Exibir galeria sob demanda

    Pessoal, tenho um código PHP que busca imagens em subpastas, porém gostaria de fazê-lo com que fosse carregado aos poucos pois são muitas fotos, tentei de ns maneiras entender o AJAX, mas não tive sucesso. Favor! Peço ajuda. loadAjax.php $dir = new DirectoryIterator( './images/portfolio/sem_categoria' ); // array contendo os diretórios permitidos $diretoriosPermitidos = array("portfolio","sem_categoria"); foreach($dir as $file) { // verifica se $file é diferente de '.' ou '..' if (!$file->isDot()) { // listando somente os diretórios if ( $file->isDir() ) { // atribui o nome do diretório a variável $dirName = $file->getFilename(); // subdiretórios $caminho = $file->getPathname(); // chamada da função de recursividade recursivo($caminho, $dirName); } // listando somente os arquivos do diretório if ( $file->isFile() ) { // atribui o nome do arquivo a variável $fileName = $file->getFilename(); // print //echo "Arquivos: ".$fileName."<br>"; } } } function recursivo( $caminho, $dirName ){ global $dirName; $DI = new DirectoryIterator( $caminho ); foreach ($DI as $file){ if (!$file->isDot()) { if ( $file->isFile() ) { // $fileName = $file->getFilename(); // //echo $dirName.": ".$fileName."<br>"; echo "<div class='col-12 col-sm-6 col-md-4 col-lg-3 mb-2 d-flex justify-content-center' alt=''> <a href='{$fileName}' class='fresco' data-fresco-group='example' data-fresco-caption='ARJ SERVICE'> <img class='eni-img-thumb' src='images/portfolio/sem_categoria/{$dirName}/{$fileName}'> </a> </div>"; } } } } Tentei adaptar o código abaixo as minhas necessidades, mas não consegui. <script> //variavel para controle de registros retornados var pagina = 0; var pesquisa = true; //function carrega function carrega(){ $('#loading').html("<img src='img/loader.gif'/> Carregando Feeds...").fadeIn('fast'); $.ajax({ type: "POST", url: "loadAjax.php", data: "page="+pagina,//variavel passada via post cache: false, success: function(html){ if(html){ $('#loading').fadeOut('fast'); $("#result").append(html); //mostra resultado na div result pesquisa = true; }else{ $('#loading').html("Fim da pesquisa...").fadeIn('fast'); pesquisa = false; } }, error:function(html){ $('#loading').html("erro...").fadeIn('fast'); } }); }; //chama minha funcao ao carregar a pagina $(document).ready(function(){ carrega(); }); //funcao de controle do scroll da pagina, na qual ela chega ao fim é acionada chamando //minha function carrega novamente para trazer mais dados dinamicamente $(window).scroll(function(){ if($(window).scrollTop() + $(window).height() >= $(document).height()){ pagina += 1; carrega(); }; }); </script>
  10. Estou tentando aplicar um código em um site que contem uma box com um numero que fica variando e dois botões. Preciso de um código que leia o que esta na box e após isso aperte um dos botões.
  11. Boa tarde, estou começando a programar e ainda não sei qual linguagem de programação eu devo iniciar. Me de uma luz, Obrigado!
  12. Boa tarde pessoal! Tenho a seguinte REGEX, . Ela serve para detectar se uma URL vem do Youtube ou do Vimeo, e possui os parâmetros necessários. (?:(?i)(?:https:|http:)?\/\/)?(?:(?i)(?:www\.youtube\.com\/(?:embed\/|watch\?v=)|youtu\.be\/|youtube\.googleapis\.com\/v\/)(?<YoutubeID>[a-z0-9-_]{11,12})|(?:vimeo\.com\/|player\.vimeo\.com\/video\/)(?<VimeoID>[0-9]+)) Ela é totalmente funcional no modelo PCRE (PHP). Testada aqui: https://regex101.com/r/PVdjg0/2 Utilizo estes matches pra testar: Porém, preciso utiliza-la em um campo HTML dentro do atributo pattern. Por isso, preciso convertê-la para o padrão do JS. Mas aí começam uma série de problemas. Se eu utilizo como está, recebo o seguinte erro: ? The preceding token is not quantifiable Testes que realizei: - Se eu escapar o (?i) desta maneira: (/?i), só são validadas entradas do Vimeo. - Se eu deixar sem o ?, mesma coisa. - Se eu retirar a condição (?i), fica case sensitive, e não posso utilizar, pois videos do Youtube tem o parâmetro URL muitas vezes com maisculos, minusculos... Alguém pode me ajudar?
  13. mamotinho

    Erro ao enviar imagem via ajax usando sweetalert2

    Olá, estou tentando enviar a url que corresponde a imagem porém não é possivel enviar essa url pois ela é muito grande, teria alguma maneira de eu conseguir fazer esse envio sem perde muito o sentido. já rodei a internet toda mais não conseguir resolver a questão. segua abaixo o exemplo function photo(idx){ var character = idx; (async () => { const { value: file } = await Swal.fire({ input: 'file', inputAttributes: { accept: 'image/*', 'aria-label': 'Selecione sua imagem' } }) if (file) { const reader = new FileReader() reader.onload = (e) => { var mystring = e.target.result; var encodedString = btoa(mystring); //alert(encodedString); //código que envia os dados. new Ajax.Updater('carfunc', 'pag/request/user/swal.php?Idx='+character+'&form=6&image='+encodedString, {method: 'get', asynchronous:true, evalScripts:true}); carregando('#carfunc'); } reader.readAsDataURL(file) } })() } Aqui é a chamada da função: <div class="skillBlock"> <div class="skillBlock-block"> <div class="skillBlock-img"> <img src="images/skill_5.jpg" alt=""> <span class="m-number">3</span> </div> <div class="skillBlock-info" style="cursor:pointer;" onclick="javascript:photo('<?=soNumero(antSQL(anti_injection(htmlspecialchars($rowsCharacter->CharacterIdx))))?>')"> <p>Adicionar Emblema</p> adicione emblema de guild </div> </div> Algum especialista do coração bom poderia me tirar esse sufoco.
  14. Eu tenho um array de objetos, esses objetos são como jobs a serem feitos e cada job tem um tempo estimado para ser finalizado. Eu preciso agrupar esses objetos em outro array, com grupos de projetos que levam até 8 horas para serem feitos. Exemplo: const arr = [ { id: 1, hrs: 2, }, { id: 2, hrs: 4, }, { id: 3, hrs: 6 } ] O output disso é: [[1,3],[2]] O agrupamento é feito pelo ID. Nesse caso, foi agrupado o id 1 com o 3, porque a soma das horas do objeto do ID 1 com o ID 3 dá 8, mais próximo de 8 do que a soma do ID 1 com o ID 2. O ID 2 ficou em um outro grupo, já que somando os 3 passaria de 8 horas. Não se ficou bem claro, mas a minha dificuldade aqui é somar todos os índices, verificar a soma que mais se aproxime de 8 e agrupá-la, e depois agrupar os demais.
  15. Mandei uma imagem em anexo pra entender Alguém pode me ajudar como posso fazer um script que vai pegar o id de cada produto ir no banco de dados e atualizar o campos visualizações vendas concretizadas isso de modo automatico sem que eu precise ficar clicando em atualizar a pagina
  16. Rebeca Julia Bronzatti

    Filtros com PHP, AJAX e MySQL

    Eu tô fazendo um site pra uma imobiliária e nele eu possui filtros que não são obrigatórios e nem possuem submit, ex: quantidade de quartos, quantidade de vagas, localização e assim por diante, algo em torno de 15 filtros o usuário pode escolher os filtros que deseja e assim o site realizar uma busca, como não tenho submit tô usando ajax e javascript pra conseguir recuperar os valores, o meu problema está em executar um query com esses valores, eu tô com um form de teste com dois campos só, porém ele não ta executando redondinho do jeito que preciso, tenho um input e um select se eu selecionar um dos dois ele executa a query mas mostra que a outra não está definida, se eu preencho as duas ele não executa a query, se alguém puder me dar um help em como fazer isso agradeceria muito, tô enrolada nisso faz um tempinho já <body> <form method="POST" id="form-pesquisa" action=""> <input type="text" id="pesquisa" style="width: 35%; height: 40px; text-align: center; font-size: 25px;"/> <select name="idade" id="select_idade"> <option value="19" selected>19</option> <option value="18">18</option> </select> </form> <div class="resultado" style="border: 1px solid #222; width: 35%; margin-top: 30px; height: 30px;"> </div> </body> $(function(){ $("#select_idade").change(function(){ var select_idade = $(this).val(); if(select_idade != ''){ var select = { idade : select_idade } $.post('busca_banco.php', select, function(retorna){ $(".resultado").html(retorna); }); }else{ $(".resultado").html(''); } }); //Pesquisar sem refresh na página $("#pesquisa").keyup(function(){ var pesquisa = $(this).val(); //Verifica se há algo digitado if(pesquisa != ''){ var dados = { palavra : pesquisa } $.post('busca_banco.php', dados, function(retorna){ //Mostra dentro da div os resultados obtidos $(".resultado").html(retorna); }); }else{ $(".resultado").html(''); } }); }); $idade = $_POST['idade']; $busca = $_POST['palavra']; $busca_select = "SELECT * FROM teste WHERE TRUE AND IF('$idade' != 0, TRUE) AND IF('$busca' !=0, TRUE)"; $result_busca = mysqli_query($cnn, $busca_select); if(mysqli_num_rows($result_busca)<=0){ echo '<div style = "width:80%; overflow:auto; border-bottom:1px solid #333"> Não existe resultado </div> '; }else{ while ($rows = mysqli_fetch_assoc($result_busca)){ echo '<div style = "width:35%; overflow:auto; border-bottom:1px solid #333"> '.$rows['idade'].' - '.$rows['palavra'].' <br> </div> '; } }
  17. Marcelodiehl

    Dúvida quanto onoffswitch-label

    Boa tarde, tenho um código php para envio de documentos para uma área do cliente e no admin onde eu realizo o upload dos documentos tem um input onoffswitch onde eu ativo ou desativo (Quando Ativo = "Mostrar na area dos clientes") mas quando envio um arquivo ele fica por default desativado, então tenho que ativar para que o cliente Visualize o documento. O que eu preciso é que este botão fique Ativado por default, mas não encontro no script onde mudo isso. Peço desculpas pela minha ignorancia em PHP, mas estou iniciando um curso esta semana, não sei muito ainda, mas já tenho este desafio. Alguém poderia me ajudar? <?php defined('BASEPATH') or exit('No direct script access allowed'); ?> <div class="modal fade" id="customer_file_share_file_with" data-total-contacts="<?php echo count($contacts); ?>" tabindex="-1" role="dialog"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title"><?php echo _l('share_file_with'); ?></h4> </div> <div class="modal-body"> <?php echo form_hidden('file_id'); ?> <?php echo render_select('share_contacts_id[]',$contacts,array('id',array('firstname','lastname')),'customer_contacts',array(get_primary_contact_user_id($client->userid)),array('multiple'=>true,'data-actions-box'=>true),array(),'','',false); ?> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal"><?php echo _l('close'); ?></button> <button type="button" class="btn btn-info" onclick="do_share_file_contacts();"><?php echo _l('confirm'); ?></button> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> <h4 class="no-mtop bold"><?php echo _l('customer_attachments'); ?> <br /> <small class="text-info"><?php echo _l('customer_files_info_message'); ?></small> </h4> <hr /> <?php if(isset($client)){ ?> <?php echo form_open_multipart(admin_url('clients/upload_attachment/'.$client->userid),array('class'=>'dropzone','id'=>'client-attachments-upload')); ?> <input type="file" name="file" multiple /> <?php echo form_close(); ?> <div class="text-right mtop15"> <button class="gpicker" data-on-pick="customerGoogleDriveSave"> <i class="fa fa-google" aria-hidden="true"></i> <?php echo _l('choose_from_google_drive'); ?> </button> <div id="dropbox-chooser"></div> </div> <div class="attachments"> <div class="mtop25"> <table class="table dt-table scroll-responsive" data-order-col="2" data-order-type="desc"> <thead> <tr> <th width="30%"><?php echo _l('customer_attachments_file'); ?></th> <th><?php echo _l('customer_attachments_show_in_customers_area'); ?></th> <th><?php echo _l('file_date_uploaded'); ?></th> <th><?php echo _l('options'); ?></th> </tr> </thead> <tbody> <?php foreach($attachments as $type => $attachment){ $download_indicator = 'id'; $key_indicator = 'rel_id'; $upload_path = get_upload_path_by_type($type); if($type == 'invoice' || $type == 'proposal' || $type == 'estimate' || $type == 'credit_note'){ $url = site_url() .'download/file/sales_attachment/'; $download_indicator = 'attachment_key'; } else if($type == 'contract'){ $url = site_url() .'download/file/contract/'; $download_indicator = 'attachment_key'; } else if($type == 'lead'){ $url = site_url() .'download/file/lead_attachment/'; } else if($type == 'task'){ $url = site_url() .'download/file/taskattachment/'; $download_indicator = 'attachment_key'; } else if($type == 'ticket'){ $url = site_url() .'download/file/ticket/'; $key_indicator = 'ticketid'; } else if($type == 'customer'){ $url = site_url() .'download/file/client/'; $download_indicator = 'attachment_key'; } else if($type == 'expense'){ $url = site_url() .'download/file/expense/'; $download_indicator = 'rel_id'; } ?> <?php foreach($attachment as $_att){ ?> <tr id="tr_file_<?php echo $_att['id']; ?>"> <td> <?php $path = $upload_path . $_att[$key_indicator] . '/' . $_att['file_name']; $is_image = false; if(!isset($_att['external'])) { $attachment_url = $url . $_att[$download_indicator]; $is_image = is_image($path); $img_url = site_url('download/preview_image?path='.protected_file_url_by_path($path,true).'&type='.$_att['filetype']); $lightBoxUrl = site_url('download/preview_image?path='.protected_file_url_by_path($path).'&type='.$_att['filetype']); } else if(isset($_att['external']) && !empty($_att['external'])){ if(!empty($_att['thumbnail_link']) && $_att['external'] == 'dropbox'){ $is_image = true; $img_url = optimize_dropbox_thumbnail($_att['thumbnail_link']); } $attachment_url = $_att['external_link']; } if($is_image){ echo '<div class="preview_image">'; } ?> <a href="<?php if($is_image){ echo isset($lightBoxUrl) ? $lightBoxUrl : $img_url; } else {echo $attachment_url; } ?>"<?php if($is_image){ ?> data-lightbox="customer-profile" <?php } ?> class="display-block mbot5"> <?php if($is_image){ ?> <div class="table-image"> <div class="text-center"><i class="fa fa-spinner fa-spin mtop30"></i></div> <img src="#" class="img-table-loading" data-orig="<?php echo $img_url; ?>"> </div> <?php } else { ?> <i class="<?php echo get_mime_class($_att['filetype']); ?>"></i> <?php echo $_att['file_name']; ?> <?php } ?> </a> <?php if($is_image){ echo '</div>'; } ?> </td> <td> <div class="onoffswitch"<?php if($type != 'customer'){?> data-toggle="tooltip" data-title="<?php echo _l('customer_attachments_show_notice'); ?>" <?php } ?>> <input type="checkbox" <?php if($type != 'customer'){echo 'disabled';} ?> id="<?php echo $_att['id']; ?>" data-id="<?php echo $_att['id']; ?>" class="onoffswitch-checkbox customer_file" data-switch-url="<?php echo admin_url(); ?>misc/toggle_file_visibility" <?php if(isset($_att['visible_to_customer']) && $_att['visible_to_customer'] == 1){echo 'checked';} ?>> <label class="onoffswitch-label" for="<?php echo $_att['id']; ?>"></label> </div> <?php if($type == 'customer' && $_att['visible_to_customer'] == 1){ $file_visibility_message = ''; $total_shares = total_rows(db_prefix().'shared_customer_files',array('file_id'=>$_att['id'])); if($total_shares == 0){ $file_visibility_message = _l('file_share_visibility_notice'); } else { $share_contacts_id = get_customer_profile_file_sharing(array('file_id'=>$_att['id'])); if(count($share_contacts_id) == 0){ $file_visibility_message = _l('file_share_visibility_notice'); } } echo '<span class="text-warning'.(empty($file_visibility_message) || total_rows(db_prefix().'contacts',array('userid'=>$client->userid)) == 0 ? ' hide': '').'">'.$file_visibility_message.'</span>'; if(isset($share_contacts_id) && count($share_contacts_id) > 0){ $names = ''; $contacts_selected = ''; foreach($share_contacts_id as $file_share){ $names.= get_contact_full_name($file_share['contact_id']) .', '; $contacts_selected .= $file_share['contact_id'].','; } if($contacts_selected != ''){ $contacts_selected = substr($contacts_selected,0,-1); /**na linha abaixo em </a> ' . _l('share_file_with_show, trocando o _1 por 0 desabilita envio */ } if($names != ''){ echo '<a href="#" onclick="do_share_file_contacts(\''.$contacts_selected.'\','.$_att['id'].'); return false;"><i class="fa fa-pencil-square-o"></i></a> ' . _l('share_file_with_show',mb_substr($names, 0,-2)); } } } ?> </td> <td data-order="<?php echo $_att['dateadded']; ?>"><?php echo _dt($_att['dateadded']); ?></td> <td> <?php if(!isset($_att['external'])){ ?> <button type="button" data-toggle="modal" data-file-name="<?php echo $_att['file_name']; ?>" data-filetype="<?php echo $_att['filetype']; ?>" data-path="<?php echo $path; ?>" data-target="#send_file" class="btn btn-info btn-icon"><i class="fa fa-envelope"></i></button> <?php } else if(isset($_att['external']) && !empty($_att['external'])) { echo '<a href="'.$_att['external_link'].'" class="btn btn-info btn-icon" target="_blank">'.($_att['external'] == 'dropbox' ? '<i class="fa fa-dropbox"></i>' : '<i class="fa fa-google"></i>').'</a>'; } ?> <?php if($type == 'customer'){ ?> <a href="<?php echo admin_url('clients/delete_attachment/'.$_att['rel_id'].'/'.$_att['id']); ?>" class="btn btn-danger btn-icon _delete"><i class="fa fa-remove"></i></a> <?php } ?> </td> <?php } ?> </tr> <?php } ?> </tbody> </table> </div> </div> <?php include_once(APPPATH . 'views/admin/clients/modals/send_file_modal.php');
  18. Rafaelmcd

    Redirecionamento 301

    Olá, tenho um site em WordPress e preciso de uma regra para fazer um redirecionamento em massa, um redirecionamento 301. A regra seria mais ou menos assim, alterar links assim: https://site.com/blog/leia-top-games para https://site.com/blog/top-games Ou seja, precisa retirar o "leia-" de todos os link e redirecionar para o link novo. Alguém poderia me ajudar?
  19. violin101

    JAVASCRIPT - Verificar duplicidade de Código

    Caros amigos saudações... Sou um pouco novato em JAVASCRIPT, gostaria de tirar uma dúvida com os amigos. Tenho uma Tabela onde o usuário escolhe o Produto e através de um botão agregar, o sistema cria a Tabela. ATÉ AQUI TUDO BEM. Minha dúvida: como consigo verificar se o Código de algum produto já foi incluído ? caso foi, o sistema avisa que já foi informado o código anteriormente. Código em Javascript //Status dos Botões LIMPAR | AGREGAR | ADICIONAR - iniciar como desabilitado. document.getElementById("btn-limp").disabled = true; document.getElementById("btn-agregar").disabled = true; document.getElementById("adicionar").disabled = true; /*---Função para Capturar o Produto selecionado---*/ $(document).on("click",".btn-prod",function(){ prd = $(this).val(); infoprd = prd.split("*"); $("#idProdutos").val(infoprd[0]); $("#cod_interno").val(infoprd[1]); $("#descricao").val(infoprd[2]); $("#prd_unid").val(infoprd[3]); $("#vlr_unit").val(infoprd[4]); $("#qtd_prod").val(infoprd[5]); $("#vlr_total").val(infoprd[6]); $("#modal_prod").modal("hide"); //Função para Atualizar o Status do Botão statusLimparAgregar() }); //Nessa parte do AGREGAR gostaria de veririfcar //se houve ou não duplicidade de código do produto //informado $("#btn-agregar").on("click",function(){ //Monta a Tabela dos Produtos a serem Devolvidos html = "<tr>"; html += "<td width='10%' height='10'><input type='hidden' name='id_prds[]' value='"+infoprd[0]+"'>"+infoprd[1]+"</td>"; html += "<td width='32%' height='10'><input type='hidden' name='descricao[]' value='"+infoprd[2]+"'>"+infoprd[2]+"</td>"; html += "<td width='10%' height='10' style='text-align:center;'><input type='hidden' name='esp[]' value='"+infoprd[3]+"'>"+infoprd[3]+"</td>"; html += "<td width='12%' height='10' style='text-align:center;'><input type='hidden' name='qtd_prod[]' value='"+infoprd[5]+"'>"+infoprd[5]+"</td>"; html += "<td width='14%' height='10' style='text-align:right;'><input type='hidden' name='vlr_unit[]' value='"+infoprd[4]+"'>"+infoprd[4]+"</td>"; html += "<td width='14%' height='10' style='text-align:right;'><input type='hidden' name='vlr_total[]' value='"+infoprd[6]+"'>"+infoprd[6]+"</td>"; html += "<td width='10%' height='10' style='text-align:center;'>"+ "<button type='button' class='btn btn-danger btn-remove-produto' style='padding: 2px 5px;' title='Remover Item da Lista'>"+ "<span class='fa fa-remove'></span></button></td>"; html += "</tr>"; $("#tbventas tbody").append(html); //Função para Somar os Itens do Lançamento somar(); $("#btn-agregar").val(null); $("#descricao").val(null); $("#cod_interno").val(null); $("#prd_unid").val(null); $("#vlr_unit").val(null); $("#qtd_prod").val(null); $("#vlr_total").val(null); //Desabilita Buttons document.getElementById("btn-limp").disabled = true; document.getElementById("btn-agregar").disabled = true; }); Grato, Cesar
  20. Amigos preciso validar este meu formulario, de forma que ele so envie os dados se o numero do cartão seja valido. <form id="updateCreditCard" action="index4.php" method="post"> <fieldset style="border: none"> <div class="divBlock"> <div class="divBlock"> <label for="Numbercpf">CPF *</label> <input required="required" type="text" name="cpf" id="cpf" maxlength="14" > </div> <div class="divBlock"> <label for="cartao">Numero do Cartão *</label> <input type="text" id="holderName" maxlength="19" name="cartao"> </div> </div> <div class="btn-container"> <button onKeyPress="" class="sendUpdating">Continuar</button> </div>
  21. Eu tenho 2 arquivos CSS externos que contém backgrounds da página. Em 1 só tem links para imagens .webP e em outro somente .PNG , eu estou usando um script para detectar se o browser aceita .webP e caso afirmativo ele altera o link CSS externo em HEAD para o css externo com .webP, por padrão inicialmente ele aponta para o .png, testei numa página mais simples e deu ok, mas na hora de colocar aonde quero não funcionou, segue o código: No HEAD: <link href="‪arquivos_css/png.css" rel="stylesheet" id="key"> No JS: ////////////////////////////////////////////////////////////// // FUNÇÃO QUE CRIA O LINK EXTERNO CSS PARA INSERIR NO HEAD // OK// ////////////////////////////////////////////////////////////// function loadCSS(url){ var link = document.createElement('link'); link.setAttribute('href', url ); link.setAttribute('rel', "stylesheet" ); link.setAttribute('id', "key" ); var para = document.getElementsByTagName('head')[0]; //Nó pai HEAD var velho = document.getElementById('key'); //local exato do elemento a ser substituido para.replaceChild(link, velho); //Substituímos o velho pelo novo(link) } ////////////////////////////// Chamada à função do webP ///////////////////////////// WebpIsSupported(function(isSupported){ if(isSupported){ //CHAMA A FUNÇÃO LOADCSS e carrega o link CSS externo com WEBP loadCSS('arquivos_css/webp.css'); } }); ////////////////////////////////////////////////////////////// // FUNÇÃO QUE DETECTA A COMPATIBILIDADE DO BROWSER COM WEBP // ////////////////////////////////////////////////////////////// function WebpIsSupported(callback){ if(!window.createImageBitmap){ callback(false); return; } var webpdata = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoCAAEAAQAcJaQAA3AA/v3AgAA='; fetch(webpdata).then(function(response){ return response.blob(); }).then(function(blob){ createImageBitmap(blob).then(function(){ callback(true); }, function(){ callback(false); }); }); } O erro que está dando no chrome é esse: Failed to load resource: net::ERR_FILE_NOT_FOUND já mudei na função loadCSS o endreço dos arquivos de loadCSS('arquivos_css/webp.css'); para loadCSS('/arquivos_css/webp.css'); e não funciona.... o arquivo CSS externo contém backgrounds dentro do seletor HTML tipo : html { background-image.....(1); background-image.....(2); background-image.....(3); etc } eu vou no elements do chome e está lá no HEAD conforme quero mas não carrega na página e dá este erro no console. – o que pode estar acontecendo ? ?
  22. Preciso colocar a o atributo fadeIN e fadeOut em uma lista de acordo com o numero que o usuário clicar. Porem não estou conseguindo formular a função do script para isso No id #RESPOSTA tenho os números 1 - 5 - 10 - 20 - 30 - 40 - 50 - 100 - 200 - 300 O que estou tentando e ao clicar na resposta 10 por exemplo, Todos os resultados da lista maiores que 10 sumam e logo depois se eu clicar em 50, permaneça os abaixo de 10 e apareça os ID's ate 50 Como se fosse um filtro, clico em 10, só aparece os de 1 ate 10, clico em 50, so aparece os entre 1 ate 50 e assim por diante. Porem dinamicamente, so adicionando fadeOut e fadeIn
  23. turfeaugusto2

    mudar imagens em divs

    ola sou novo no forum. e novo em programaçao gostaria da ajuda pra saber como trocar imagens de divs diferentes,pois uma estra trocando a imagem da outra e ja´tentei de tudo pra consertar..agradeço muito pela ajuda <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <style> *{margin:0;padding:0;} .container{display:flex;justify-content:space-evenly;flex-wrap:wrap;background:#6ab04c;} .card img{width:100%} .price {position:absolute;margin:10px 220px;color: #6ab04c;font-size: 20px;} .card{width:260px;height:350px;justify-content:center;background:#fff;margin:5px} .nav{display:flex;align-items:center;justify-content:center} .nav img{display:flex-row;width:80px;height:52px;margin:2px;border: 1px solid #ddd;} .name{ text-transform: uppercase; font-size: 20px; color: #333; } .btn{ display:flex;justify-content:center;padding:5px; background: #6ab04c; text-align: center; color: #fff; transition: 0.3s;} .dis{ margin:0 0 10px; font-size: 16px; opacity: 0.7;} .product-info{ padding: 20px;background:silver; } .btn:hover{ background: #333; } </style> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <div class="card"> <div class="top-section"> <div class="price">$80</div><img id="image-container" src="1.png" alt=""> <div class="nav"> <img onclick="change_img(this)" src="1.png" alt=""> <img onclick="change_img(this)" src="2.png" alt=""> <img onclick="change_img(this)" src="3.png" alt=""> </div> </div> <div class="product-info"> <div class="name">Sanglasses</div> <div class="dis">Awesome Men Sanglasses</div> <a class="btn" href="#">Add to Cart</a> </div> </div> <div class="card"> <div class="top-section"> <div class="price">$80</div><img id="image-container" src="1.png" alt=""> <div class="nav"> <img onclick="change_img(this)" src="1.png" alt=""> <img onclick="change_img(this)" src="2.png" alt=""> <img onclick="change_img(this)" src="3.png" alt=""> </div> </div> <div class="product-info"> <div class="name">Sanglasses</div> <div class="dis">Awesome Men Sanglasses</div> <a class="btn" href="#">Add to Cart</a> </div> </div> <div class="card"> <div class="top-section"> <div class="price">$80</div><img id="image-container" src="1.png" alt=""> <div class="nav"> <img onclick="change_img(this)" src="1.png" alt=""> <img onclick="change_img(this)" src="2.png" alt=""> <img onclick="change_img(this)" src="3.png" alt=""> </div> </div> <div class="product-info"> <div class="name">Sanglasses</div> <div class="dis">Awesome Men Sanglasses</div> <a class="btn" href="#">Add to Cart</a> </div> </div> </div> <script type="text/javascript"> var container = document.getElementById("image-container"); function change_img(image) { container.src = image.src; } </script> </body> </html>
  24. turfeaugusto2

    mudar imagens em divs

    ola sou novo no forum. e novo em programaçao gostaria da ajuda pra saber como trocar imagens de divs diferentes,pois uma estra trocando a imagem da outra e ja´tentei de tudo pra consertar..agradeço muito pela ajuda <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <div class="card"> <div class="top-section"> <div class="price">$80</div><img id="image-container" src="1.png" alt=""> <div class="nav"> <img onclick="change_img(this)" src="1.png" alt=""> <img onclick="change_img(this)" src="2.png" alt=""> <img onclick="change_img(this)" src="3.png" alt=""> </div> </div> <div class="product-info"> <div class="name">Sanglasses</div> <div class="dis">Awesome Men Sanglasses</div> <a class="btn" href="#">Add to Cart</a> </div> </div> <div class="card"> <div class="top-section"> <div class="price">$80</div><img id="image-container" src="1.png" alt=""> <div class="nav"> <img onclick="change_img(this)" src="1.png" alt=""> <img onclick="change_img(this)" src="2.png" alt=""> <img onclick="change_img(this)" src="3.png" alt=""> </div> </div> <div class="product-info"> <div class="name">Sanglasses</div> <div class="dis">Awesome Men Sanglasses</div> <a class="btn" href="#">Add to Cart</a> </div> </div> <div class="card"> <div class="top-section"> <div class="price">$80</div><img id="image-container" src="1.png" alt=""> <div class="nav"> <img onclick="change_img(this)" src="1.png" alt=""> <img onclick="change_img(this)" src="2.png" alt=""> <img onclick="change_img(this)" src="3.png" alt=""> </div> </div> <div class="product-info"> <div class="name">Sanglasses</div> <div class="dis">Awesome Men Sanglasses</div> <a class="btn" href="#">Add to Cart</a> </div> </div> </div> <script type="text/javascript"> var container = document.getElementById("image-container"); function change_img(image) { container.src = image.src; } </script> </body> </html>
  25. Iai galera blz? Tô com uma duvida aqui. Eu tenho um menu Vertical Tabs que basicamente me ajuda a navegar em uma pagina sem precisar criar varias rotas para outras paginas. Segue o codigo: <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> * {box-sizing: border-box} body {font-family: "Lato", sans-serif;} /* Style the tab */ .tab { float: left; border: 1px solid #ccc; background-color: #f1f1f1; width: 30%; height: 300px; } /* Style the buttons inside the tab */ .tab button { display: block; background-color: inherit; color: black; padding: 22px 16px; width: 100%; border: none; outline: none; text-align: left; cursor: pointer; transition: 0.3s; font-size: 17px; } /* Change background color of buttons on hover */ .tab button:hover { background-color: #ddd; } /* Create an active/current "tab button" class */ .tab button.active { background-color: #ccc; } /* Style the tab content */ .tabcontent { float: left; padding: 0px 12px; border: 1px solid #ccc; width: 70%; border-left: none; height: 300px; } </style> </head> <body> <h2>Vertical Tabs</h2> <p>Click on the buttons inside the tabbed menu:</p> <div class="tab"> <button class="tablinks" onclick="openCity(event, 'London')" id="defaultOpen">London</button> <button class="tablinks" onclick="openCity(event, 'Paris')">Paris</button> <button class="tablinks" onclick="openCity(event, 'Tokyo')">Tokyo</button> </div> <div id="London" class="tabcontent"> <h3>London</h3> <p>London is the capital city of England.</p> </div> <div id="Paris" class="tabcontent"> <h3>Paris</h3> <p>Paris is the capital of France.</p> </div> <div id="Tokyo" class="tabcontent"> <h3>Tokyo</h3> <p>Tokyo is the capital of Japan.</p> </div> <script> function openCity(evt, cityName) { var i, tabcontent, tablinks; tabcontent = document.getElementsByClassName("tabcontent"); for (i = 0; i < tabcontent.length; i++) { tabcontent[i].style.display = "none"; } tablinks = document.getElementsByClassName("tablinks"); for (i = 0; i < tablinks.length; i++) { tablinks[i].className = tablinks[i].className.replace(" active", ""); } document.getElementById(cityName).style.display = "block"; evt.currentTarget.className += " active"; } // Get the element with id="defaultOpen" and click on it document.getElementById("defaultOpen").click(); </script> </body> </html> Fonte: https://www.w3schools.com/howto/howto_js_vertical_tabs.asp Blz, agora digamos que eu tenha saído da pagina onde tem esse Vertical tab e quando retornar eu gostaria de voltar justamente do lugar de onde eu sai. Por exemplo, digamos que eu tenha saído do menu na parti Paris para uma pagina onde tem tudo de Paris quando eu apertar no botão voltar eu quero retornar a pagina onde tem o menu e quero que ele fique na opção Paris inclusive marcado. Quando ele volta ele só vai para a primeira opção. Tem algum jeito de fazer isso?
×

Informação importante

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