Jump to content
chilli2

Configurar um Background que fique piscando

Recommended Posts

Boa tarde,

 

Pessoal, eu gostaria de fazer o seguinte, que o meu background pisque com cores diferentes quando aparecer uma mensagem. Ex.

quando a palavra for (up) o background pisque na cor verde;

quando a palavra for (down) o background pisque na cor vermelha;

 

Desde já muito obrigado.

Share this post


Link to post
Share on other sites

Boa tarde,

 

faça algo parecido com isso

var palavra = 'up';

if (palavra != '') {
	if (palavra == 'up') {
		document.body.style.backgroundColor = "#00FF00";
	} else if (palavra == 'down') {
		document.body.style.backgroundColor = "#FF0000";
	}

	setTimeout(function() {
		document.body.style.backgroundColor = "initial";
	}, 300);
}

Onde é verificado se a variável palavra não é vazia (não sei da onde você vai pegar o valor para a variável), depois é verificado se é up ou down, e caso seja um deles, é setado uma cor de backgroud para o elemento body, logo abaixo após 0,3 segundos, é colocado a cor original do body. Arrume o tempo de acordo com a velocidade que você deseja o efeito de piscar.

Share this post


Link to post
Share on other sites
14 horas atrás, Everson da Luz disse:

Boa tarde,

 

faça algo parecido com isso


var palavra = 'up';

if (palavra != '') {
	if (palavra == 'up') {
		document.body.style.backgroundColor = "#00FF00";
	} else if (palavra == 'down') {
		document.body.style.backgroundColor = "#FF0000";
	}

	setTimeout(function() {
		document.body.style.backgroundColor = "initial";
	}, 300);
}

Onde é verificado se a variável palavra não é vazia (não sei da onde você vai pegar o valor para a variável), depois é verificado se é up ou down, e caso seja um deles, é setado uma cor de backgroud para o elemento body, logo abaixo após 0,3 segundos, é colocado a cor original do body. Arrume o tempo de acordo com a velocidade que você deseja o efeito de piscar.

Opa, bom dia agradeço pela ajuda...então os valores up e down eu busco de uma aplicação chamada zabbix você conhece?

Share this post


Link to post
Share on other sites

Não conheço essa aplicação, então não poderei te ajudar com isso. Mas depois que você conseguir pegar os dados, faça algo parecido com esse script que coloquei, você pode até testa-lo, só abrir o console do Chrome e colocar o script lá

Share this post


Link to post
Share on other sites
3 minutos atrás, Everson da Luz disse:

Não conheço essa aplicação, então não poderei te ajudar com isso. Mas depois que você conseguir pegar os dados, faça algo parecido com esse script que coloquei, você pode até testa-lo, só abrir o console do Chrome e colocar o script lá

opa...como assim no console do chrome, desculpe...

Share this post


Link to post
Share on other sites

Realmente deu certo, soh uma ultima pergunta guri, caso eu quisesse colocar ao invés de up / down eu colocasse numeros, ex 1 = up   2 = down teria como?

Share this post


Link to post
Share on other sites
24 minutos atrás, chilli2 disse:

Realmente deu certo, soh uma ultima pergunta guri, caso eu quisesse colocar ao invés de up / down eu colocasse numeros, ex 1 = up   2 = down teria como?

 

CÓDIGO

// 1 = UP
// 2 = DOWN
var palavra = 2;

if (palavra != '') {
	if ( palavra == 1 ) { // UP
		document.body.style.backgroundColor = "#00FF00";
	} else if (palavra == 2) { // DOWN
		document.body.style.backgroundColor = "#FF0000";
	}

	setTimeout(function() {
		document.body.style.backgroundColor = "initial";
	}, 300);
}

 

Share this post


Link to post
Share on other sites

Não conheço esse sistema,

mas se você não tem o acesso ao código fonte dele, ou o sistema não disponibiliza a opção de fazer isso que você quer, não há o que fazer.

Agora se pode alterar o código dele, procure o local onde é executado o JS e altere.

Não podemos te ajudar com isso

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By violin101
      Caros amigos, saudações...
       
      Estou com um problema para mostrar o RESULTADO da multiplicação de 3 campos (inputs).
       
      Os Campos são: Comprimento x Largura x Altura.
       
      Quando todos os campos(INPUTS) são informados, a Função de Multiplicar é executada com sucesso.
      Exemplo:
      Comprimento : 1.01
      Largura...........: 2.02
      Altura..............: 3.03
      Resultado......: 6.18
       
      Quando um dos Inputs, tem valor = 0 (zero), o cálculo não é executado.
      Exemplo:
      Comprimento : 1.01
      Largura...........: 0.00
      Altura..............: 3.03
      Resultado......: 0.00
       
      Como consigo executar essa operação matemática ?
       
      Abaixo posto o Código que estou usando:
      /*---Função para Calcular o Total do Volume---*/ function calcVolume(){ //Obter valor digitado do comprimento var comprimento = document.getElementById("comprimento").value; comprimento = comprimento.replace(",","."); //Obter valor digitado da largura var largura = document.getElementById("largura").value; largura = largura.replace(",","."); //Obter valor digitado da altura var altura = document.getElementById("altura").value; altura = altura.replace(",","."); //Executa o Valor do Volume if (comprimento > 0 && largura > 0 && altura > 0) { calc_volume = parseFloat(comprimento) * parseFloat(largura) * parseFloat(altura); var numero = calc_volume.toFixed(2).split('.'); numero[0] = numero[0].split(/(?=(?:...)*$)/).join(''); document.getElementById("volume").value = numero.join('.'); } else { document.getElementById("volume").value = "0,00"; } }  
       
      Grato,
       
      Cesar
    • By Marcos RJ
      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!
       

    • By GabrielSCastro
      Olá pessoa, terminei a faculdade e recebi algumas propostas de projetos web, mas como ainda estou iniciando não tenho muita noção de quanto cobrar.
      Para um site, eu pensei em cobrar um valor razoável de entrada , e além deste valor, definir um contrato de um valor mensal para fazer manutenções necessárias, assim eu terei o cliente e uma renda sempre. Por outro lado, o cliente pode ficar com o site por pouco tempo e não chegar ao valor que eu gostaria pelo projeto. 
      Pensei também em cobrar por projeto, no minimo R$ 1000 por um site simples, já que to começando.

      Ai entra outro falta de experiência minha. Se eu cobrar por projeto, o cliente ficaria responsável por pagar o domínio e hospedagem dele ou eu contrataria uma hospedagem com a possibilidade de hospedar varios sites para quando eu tiver mais clientes.

      Indo mais direto ao ponto, gostaria que me ajudasse em como começar, cobrar, etc.

      Agradeço a quem puder ajudar.
    • By diovanedm
      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' }); });  
    • By VictorPHP
      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 popup
      function edit(){
      document.querySelector(".popupedit").style.display = "flex";
      }
×

Important Information

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