Você está aqui: JavaScript ::: Dicas & Truques ::: Mouse e Teclado

Como bloquear o botão direito do mouse em suas páginas HTML usando JavaScript

Quantidade de visualizações: 165 vezes
Em algumas situações, principalmente games desenvolvidos em JavaScript ou HTML5, nós gostaríamos de evitar o botão direito do mouse, ou seja, o menu de contexto no corpo da página web.

Para isso só precisamos retornar false para o evento oncontextmenu. Veja como isso pode ser feito no trecho de código JavaScript abaixo:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
  <title>Estudos JavaScript</title>
</head>
 
<body oncontextmenu="return false">

<h1>Você não pode usar o botão direito nessa página</h1>

</body>
</html>

Uma boa idéia é avisar ao usuário (por meio de uma mensagem window.alert) que ele não pode usar o botão de contexto no documento HTML. Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
  <title>Estudos JavaScript</title>
</head>
 
<body oncontextmenu="return aviso()">

<script type="text/javascript">
  function aviso(){
    window.alert("Botão direito não permitido.");
    return false;
  }
</script>

</body>
</html>

Agora, ao clicarmos com o botão direito do mouse na página, uma mensagem window.alert será exibida com o seguinte texto:

Botão direito não permitido.

Link para compartilhar na Internet ou com seus amigos:

JavaScript ::: Dicas & Truques ::: Data e Hora

Como usar o objeto Date em JavaScript - Curso de JavaScript para iniciantes

Quantidade de visualizações: 7334 vezes
O objeto Date é um tipo de dados embutido na linguagem JavaScript. Objetos Date são criados, em sua forma mais simples (construtor sem argumentos), da seguinte forma:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>

<script type="text/javascript">
  // vamos criar um novo objeto Date
  var hoje = new Date();

  // vamos exibir a representação deste objeto Date
  document.write("Data e hora atual: " + hoje);
</script>

</body>
</html>

Ao executarmos este código teremos um resultado parecido com:

Data e hora atual: Fri Mar 18 10:02:02 UTC-0300 2011

Note que a representação textual de um objeto Date é a data atual no formato curto (em inglês), as horas e a diferença em relação ao horário UTC (Universal Time Coordinated, sucessor do GMT - Greenwich Mean Time).

Uma vez criado um objeto Date, podemos usar vários de seus métodos para operar sobre seus valores de datas e horas. A maioria dos métodos serve simplesmente para obter ou definir os valores dos campos ano, mês, dia, horas, minutos, segundos e milisegundos, usando a hora local ou UTC. O método toString() e suas variantes nos permitem converter datas e horas para os formatos comumente exibidos aos usuários. Veja um exemplo:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  // vamos criar um novo objeto Date
  var hoje = new Date();

  // vamos exibir a representação deste objeto Date
  document.write("Data e hora atual: " + hoje.toLocaleString());
</script>


Ao executarmos este código teremos um resultado parecido com:

Data e hora atual: sexta-feira, 18 de março de 2011 15:44:07

Aqui nós usamos o método toLocaleString() do objeto Date para exibir a data e hora de acordo com as configurações regionais do computador local. Os métodos getTime() e setTime() obtém ou definem a representação interna do objeto Date como o número de milisegundos decorridos desde a meia-noite do dia 1º de janeiro de 1970 (GMT). Neste formato padrão de milisegundos, a data e hora são representadas por um único inteiro, o que facilita os cálculos envolvendo datas e horas. O padrão ECMAScript exige que o objeto Date seja capaz de representar qualquer data e hora, na precisão de milisegundos, na faixa de 100 milhões de anos antes ou depois de 01/01/1970.


JavaScript ::: Dicas & Truques ::: Trigonometria - Funções Trigonométricas

Como calcular o comprimento da hipotenusa em JavaScript dadas as medidas do cateto oposto e do cateto adjascente

Quantidade de visualizações: 882 vezes
Nesta dica mostrarei como é possível usar a linguagem JavaScript para retornar o comprimento da hipotenusa dadas as medidas do cateto oposto e do cateto adjascente. Vamos começar analisando a imagem a seguir:



Veja que, nessa imagem, eu já coloquei os comprimentos da hipotenusa, do cateto oposto e do cateto adjascente. Para facilitar a conferência dos cálculos, eu coloquei também os ângulos theta (que alguns livros chamam de alfa) e beta já devidamente calculados.

Então, sabendo que o quadrado da hipotenusa é igual à soma dos quadrados dos catetos (Teorema de Pitógoras):

\[c^2 = a^2 + b^2\]

Tudo que temos a fazer a converter esta fórmula para código JavaScript. Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
  <title>Estudos JavaScript</title>
</head>
 
<body>

<script type="text/javascript">
  var a = 20; // medida do cateto oposto
  var b = 30; // medida do cateto adjascente
  
  // agora vamos calcular o comprimento da hipotenusa
  var c = Math.sqrt(Math.pow(a, 2) + Math.pow(b, 2));
 
  // e mostramos o resultado
  document.writeln("O comprimento da hipotenusa é: " + c);
</script>

</body>
</html>

Ao executar este código JavaScript nós teremos o seguinte resultado:

O comprimento da hipotenusa é: 36.05551275463989

Como podemos ver, o resultado retornado com o código JavaScript confere com os valores da imagem apresentada.


JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Como inverter a ordem dos elementos de um array em JavaScript - Vetores e matrizes em JavaScript

Quantidade de visualizações: 11198 vezes
Em algumas situações nós precisamos inverter a ordem dos elementos em um vetor (array) em JavaScript. Para isso nós podemos usar o método reverse() do objeto Array.

Veja o código JavaScript completo para o exemplo, incluindo o documento HTML:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudando JavaScript</title>
</head>
<body>

<script type="text/javascript">
  var valores = new Array(1, 2, 3, 4, 5);
  document.write("Valores no vetor: " + valores + "<br>");
  valores.reverse();
  document.write("Fiz uma chamada ao método reverse()<br>");
  document.write("Valores no vetor: " + valores);
</script>
 
</body>
</html>

Ao executarmos este código nós teremos o seguinte resultado:

Valores no vetor: 1,2,3,4,5
Fiz uma chamada ao método reverse()
Valores no vetor: 5,4,3,2,1


Desafios, Exercícios e Algoritmos Resolvidos de JavaScript

Veja mais Dicas e truques de JavaScript

Dicas e truques de outras linguagens

Códigos Fonte

Programa de Gestão Financeira Controle de Contas a Pagar e a Receber com Cadastro de Clientes e FornecedoresSoftware de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimento
Diga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais
Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidadesControle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidades
Tenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais

Linguagens Mais Populares

1º lugar: Java
2º lugar: Python
3º lugar: C#
4º lugar: PHP
5º lugar: C
6º lugar: Delphi
7º lugar: JavaScript
8º lugar: C++
9º lugar: VB.NET
10º lugar: Ruby



© 2025 Arquivo de Códigos - Todos os direitos reservados
Neste momento há 19 usuários muito felizes estudando em nosso site.