Jump to content

Biel.

Members
  • Content count

    1111
  • Joined

  • Last visited

Community Reputation

9 Regular

About Biel.

  • Birthday 11/29/1997

Informações Pessoais

  • Sexo
    Masculino

Recent Profile Visitors

4689813 profile views
  1. Olá pessoal. Ao digitar um texto qualquer no input e pressionar submit o valor do atributo href é alterado temporariamente. Como alterar permanentemente no corpo do documento o valor do atributo href, digitando um nome de link qualquer no campo input e em seguida submit ? <!DOCTYPE html> <html> <head> <style> input { width: 100%; font-size: 20px; } textarea { width: 100%; font-size: 16px; height: 200px; } .class88 { margin-top: 50px; padding: 10px; max-width: 100px; } </style> </head> <body> <h2> alterar valor do atributo href</h2> digite um texto qualquer <input type="text" class="class42" value=""> <a id="linkToChange" href="teste5.php" class="class43"></a> <input type="submit" class="class88" value="enviar" onclick="alterarHref()"> <script> function alterarHref() { // pega o valor da class42 var valorDaclass42 = document.querySelector('.class42').value.trim(); // altera o valor do atributo href para o valorDaclass42 sugerido document.querySelector('.class43').setAttribute('href', valorDaclass42); console.log("Href alterado:", valorDaclass42); } </script> </body> </html>
  2. Biel.

    transição suave

    Você não tem mais argumento e agora focou em pontos irrelevantes. Sempre dei o nome de tabela_aprendiz por motivos que não convém que você saiba; e você sempre achou isso ridículo ? Qual nome de tabela você segere que eu coloque nos meus próximos posts? Era só o que me faltava. O certo é trazer a solução de acordo com a pergunta e acrescentar: O que você pediu é possível fazer, segue o exemplo e colocar uma nota tipo: Mais não é viável que manipule input file desta forma devido às restrições de segurança dos navegadores. Você não responde de acordo com minha pergunta e quer que eu concorde, porque não é viável devido às restrições de segurança dos navegadores. Nota: Responda somente o que for perguntado e acrescente uma observação se julgar necessário e deixe que o colega decida o que fazer. Vale lembrar também que você não sabe se é para rodar locahost, se é para teste visando outras questões e muitos outras possibilidades. Mais você se acha capaz de saber o real objetivo da postagem a ponto de fazer toda apelação possível para que o colega valide seu post. Quanta agressividade! Qualquer pessoa que tem bom senso entende claramente meu ponto de vista e percebe facilmente o quanto você é apelativo! É feio e nos traz resultados ruins para nossa vida de modo geral ser apelativo com razão, agora imagina sem razão! Não vou interagir com pessoas apelativas!!! Não vale a pena.
  3. Biel.

    transição suave

    O que postei foi: Selecionar uma imagem qualquer no input1 e carregar automaticamente a mesma imagem no input2. Sua solução carrega somente um input1 e exibe duas imagens e você quer que eu valide o que você apresentou? Porque sua interpretação está correta e a minha errada? Parabens para você! Vai lá meche no código e posta aqui dizendo que eu tenho a tendência em rejeitar soluções que não se originam do meu trabalho.
  4. Biel.

    transição suave

    Você tem dificuldade de interpretação. Nada foi resolvido. Nota: Você está adicionando recursos que não pedi e tirou o aleatório que postei , distanciando ainda mais da solução, mas na sua cabeca estou rejeitando soluções que não se originam do meu trabalho. É inacreditável como você é apelativo, qualquer um percebe isso facilmente !
  5. Biel.

    transição suave

    Hora você diz que corrigiu o problema e hora você diz que o problema está no código que postei. Se o código que postei está errado ou imcompleto, então você não corrigiu coisa alguma e pelo visto também não sabe o caminho para chegar na solução. Você realmente é incrível , tem resposta pra tudo !
  6. Biel.

    transição suave

    Nada foi resolvido, mesmo assim obrigado !
  7. Olá pessoal. BannerA está funcionando normalmente. Como usar mesmo script para bannerB e bannerC. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Banner Aleatório</title> <style> /* Estilos opcionais para o banner */ #divPai { margin: auto; border: 2px solid red; } #bannerA { width: 240px; height: 480px; overflow: hidden; position: relative; } #bannerA img { width: 100%; height: auto; position: absolute; top: 0; left: 0; transition: 1.5s ease-in; } #bannerA img.active { opacity: 1; } </style> </head> <body> <div id="divPai"> <div id="bannerA" class="bannerA"> <a href="link1"><img src="image1.jpg" alt="Imagem 1"></a> <a href="link2"><img src="image2.jpg" alt="Imagem 2"></a> <a href="link3"><img src="image3.jpg" alt="Imagem 3"></a> </div> <!-- <hr> <div id="bannerB" class="bannerB"> <a href="link4"><img src="image4.jpg" alt="Imagem 4"></a> <a href="link5"><img src="image5.jpg" alt="Imagem 5"></a> <a href="link6"><img src="image6.jpg" alt="Imagem 6"></a> </div> <hr> <div id="bannerC" class="bannerC"> <a href="link7"><img src="image7.jpg" alt="Imagem 7"></a> <a href="link8"><img src="image8.jpg" alt="Imagem 8"></a> <a href="link9"><img src="image9.jpg" alt="Imagem 9"></a> </div> --> </div> <hr> <script> document.addEventListener("DOMContentLoaded", function() { // var banner = document.getElementById("divPai"); // var images = banner.querySelectorAll("img"); var images = document.querySelectorAll("#bannerA img"); // Função para exibir uma imagem aleatória function showRandomImage() { // Escolhe aleatoriamente um índice de imagem var randomIndex = Math.floor(Math.random() * images.length); // Define todas as imagens como ocultas images.forEach(function(img) { img.style.display = "none"; }); // Exibe a imagem aleatória images[randomIndex].style.display = "block"; } // Chama a função inicialmente e define um intervalo para exibir novas imagens a cada 3 segundos showRandomImage(); setInterval(showRandomImage, 1000); // makeSliderKind('.bannerA', 1000); // makeSliderKind('.bannerB', 2000); // makeSliderKind('.bannerC', 3000); }); </script> </body> </html>
  8. Biel.

    banner

    Olá pessoal. O banner abaixo está funcionando e o link acompanha o banner, até aqui tudo ok ! Quero muito fazer uma transição suave entre uma image e outra, colocando as propiedades e valores no css ou diretamente no javascript e nada de propiedades e valores no html através do style . Se possível coloque no código somente o que precisa . Obrigado! <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Banner</title> <style> /* Estilos opcionais para o banner */ .banner { width: 240px; height: 480px; overflow: hidden; position: relative; } .banner img { width: 100%; height: auto; position: absolute; top: 0; left: 0; transition: 1.5s ease-in; } .banner img.active { opacity: 1; } </style> </head> <body> <div class="banner" id="banner"> <a href="link1" class="ggg"><img src="image1.jpg" alt="Imagem 1"></a> <a href="link2" class="ggg"><img src="image2.jpg" alt="Imagem 2"></a> <a href="link3" class="ggg"><img src="image3.jpg" alt="Imagem 3"></a> <a href="link4" class="ggg"><img src="image4.jpg" alt="Imagem 4"></a> <a href="link5" class="ggg"><img src="image5.jpg" alt="Imagem 5"></a> </div> <script> document.addEventListener("DOMContentLoaded", function() { var banner = document.getElementById("banner"); var images = banner.querySelectorAll("img"); // Função para exibir uma imagem aleatória function showRandomImage() { // Escolhe aleatoriamente um índice de imagem var randomIndex = Math.floor(Math.random() * images.length); // Define todas as imagens como ocultas images.forEach(function(img) { img.style.display = "none"; }); // Exibe a imagem aleatória images[randomIndex].style.display = "block"; } // Chama a função inicialmente e define um intervalo para exibir novas imagens a cada 3 segundos showRandomImage(); setInterval(showRandomImage, 3000); }); </script> </body> </html>
  9. Biel.

    transição suave

  10. Biel.

    transição suave

    Olá pessoal. O banner abaixo está funcionando normalmente, mas a transição entre uma imagem e outra está um tanto truculenta. Quero deixar suave. Como resolver isso? Obrigado ! <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>transition suave entre uma image e outra</title> <style> #banner { width: 240px; height: 480px; overflow: hidden; position: relative; } #bannerGG { width: 100%; height: auto; position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 1s ease-in-out; } /* #tete:active { opacity: 1; } */ </style> </head> <body> <div id="banner"> <img class="bannerGG" src="imagem1.png" alt="Image 1"> <img class="bannerGG" src="imagem2.png" alt="Image 2"> <img class="bannerGG" src="imagem3.png" alt="Image 3"> <img class="bannerGG" src="imagem4.png" alt="Image 4"> <img class="bannerGG" src="imagem5.png" alt="Image 5"> </div> <script> const image = document.querySelectorAll('.bannerGG'); const banner = document.getElementById('banner'); function showRandomImage() { const randomIndex = Math.floor(Math.random() * image.length); const randomImage = image[randomIndex]; const imgElement = document.createElement('img'); imgElement.src = randomImage.src; const linkElement = document.createElement('a'); linkElement.appendChild(imgElement); banner.innerHTML = ''; banner.appendChild(linkElement); } showRandomImage(); setInterval(showRandomImage, 3000); </script> </body> </html>
  11. Biel.

    colocar imagens do banner no html

    As imagens não estão aleatórias
  12. Olá pessoal. O banner abaixo está funcionando, mas quero que o link do banner venha da tag a e não do javascript . Como resolver? <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Mostrar link do banner que está na tag a</title> <style> #banner { width: 240px; height: 480px; overflow: hidden; position: relative; } .banner-img { width: 100%; height: 100%; object-fit: cover; position: absolute; /* opacity: 0; */ transition: opacity 0.5s ease-in-out; } .banner-link { display: block; width: 100%; height: 100%; } </style> </head> <body> <div id="banner"> <a href="link147"><img class="banner-img" src="imagem1.png" alt="Image 1"></a> <a href="link254"><img class="banner-img" src="imagem2.png" alt="Image 2"></a> <a href="link350"><img class="banner-img" src="imagem3.png" alt="Image 3"></a> <a href="link462"><img class="banner-img" src="imagem4.png" alt="Image 4"></a> <a href="link538"><img class="banner-img" src="imagem5.png" alt="Image 5"></a> </div> <script> const images = document.querySelectorAll('.banner-img'); const banner = document.getElementById('banner'); function showRandomImage() { const randomIndex = Math.floor(Math.random() * images.length); const randomImage = images[randomIndex]; const imgElement = document.createElement('img'); imgElement.src = randomImage.src; imgElement.alt = randomImage.alt; imgElement.classList.add('banner-img'); const linkElement = document.createElement('a'); // linkElement.appendChild(imgElement); linkElement.href = randomImage.href; linkElement.classList.add('banner-link'); linkElement.href = "page" + (randomIndex + 1) + ".html"; // Link para cada imagem linkElement.appendChild(imgElement); banner.innerHTML = ''; banner.appendChild(linkElement); } showRandomImage(); setInterval(showRandomImage, 1000); </script> </body> </html> Resolvido, Obrigado a todos !
  13. Olá pessoal. O banner abaixo está funcionando normalmente,, mas quero fazer o seguinte: Colocar as imagens diretamente no html e mostrar o link da imagem que está passando. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>colocar imagens do banner no html</title> <style> #banner { width: 240px; height: 480px; overflow: hidden; position: relative; } .banner-img { width: 100%; height: 100%; object-fit: cover; position: absolute; transition: opacity 0.5s ease-in-out; } .banner-link { display: block; width: 100%; height: 100%; } </style> </head> <body> <div id="banner"></div> <!-- <div id="banner"> <a href="link147"><img class="banner-img" src="imagem1.png" alt="Image 1"></a> <a href="link254"><img class="banner-img" src="imagem2.png" alt="Image 2"></a> <a href="link350"><img class="banner-img" src="imagem3.png" alt="Image 3"></a> <a href="link462"><img class="banner-img" src="imagem4.png" alt="Image 4"></a> <a href="link538"><img class="banner-img" src="imagem5.png" alt="Image 5"></a> </div> --> <script> // const images = document.querySelectorAll('.banner-img'); // const randomIndex = Math.floor(Math.random() * images.length); const images = [ "imagem1.png", "imagem2.png", "imagem3.png", "imagem4.png", "imagem5.png" ]; const banner = document.getElementById('banner'); function showRandomImage() { const randomIndex = Math.floor(Math.random() * images.length); const imageUrl = images[randomIndex]; const imgElement = document.createElement('img'); imgElement.src = imageUrl; imgElement.alt = "Random Image"; imgElement.classList.add('banner-img'); const linkElement = document.createElement('a'); linkElement.classList.add('banner-link'); linkElement.href = randomIndex + 1; linkElement.appendChild(imgElement); banner.innerHTML = ''; // Limpa o conteúdo anterior banner.appendChild(linkElement); } showRandomImage(); // Exibir uma imagem aleatória inicial setInterval(showRandomImage, 2000); // Alterar a imagem aleatória a cada 2 segundos </script> </body> </html>
  14. Biel.

    Carregar imagem

    Olá pessoal. Ao selecionar uma imagem qualquer no input1, estou tentando carregar automaticamente a mesma imagem no input2 input1 <input type="file" id="id1" name="input1" onchange="teste()"> <br> <br> input2 <input type="file" id="id2" name="input2"> <script> function teste(){ var x = document.getElementById('id1'); x.files; document.getElementById('id2').files.x; } } </script>
  15. Biel.

    imprimir dados na ordem alfabética

    Olá pessoal. Minha tab_aprendiz está assim: id nome 1 KRdaniel 2 HMedmundo 3 FXbruno 4 WNfernando 5 PZandre 6 YVcarlos Como imprimir os dados na ordem alfabética, depois de tirar as duas primeiras letras de cada nome, dessa forma: andre bruno carlos daniel edmundo fernando ... <?php $ggSql = mysqli_query($ggCon, "SELECT * FROM tab_aprendiz "); while (@$ggLinha = mysqli_fetch_array($ggSql)) { @$nome = $ggLinha['nome']; $nome=substr($nome,2); print $nome.'<br>'; } ?>
×

Important Information

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