How to hide one element after a certain time?

Navigation
5

So, I have a div that appears every time I submit a form, I wanted to know how I can fade this div after some time.

    
asked by anonymous 08.01.2017 / 00:05

2 answers

5

I made a function here, you can use it that way, or even in php like this: 

<?php echo "<script>mensagem('alerta','Isso é um alerta');</script>";?>

Or in js or jquery itself: 

function mensagem(tipo,msg){
		$("#mensagem").addClass(tipo);
		$("#mensagem").html(msg);
	
		setTimeout(function(){$("#mensagem").removeClass(tipo);
		$("#mensagem").html("");},10000);
		
	
	} 
$("#btt").click(function(){
 //pode usar 'confirmacao'  no lugar do alerta
mensagem("alerta","Isso é um alerta");
});
.alerta {
	border: solid 1px rgba(249,18,22,1.00);
	border-radius: 4px;
	background-color: rgba(251,12,16,0.76);
	color: #fff;
	padding: 10px 0;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	transition: 0.5s ease-out;
}
.confirmacao {
	border: solid 1px rgba(0,138,3,1.00);
	border-radius: 4px;
	background-color: rgba(40,201,8,0.76);
	color: #fff;
	padding: 10px 0;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	transition: 0.5s ease-out;
}

.aviso {
	border: solid 1px rgba(249,107,11,1.00);
	border-radius: 4px;
	background-color: rgba(249,107,11,0.6);
	color: #fff;
	padding: 10px 0;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	transition: 0.5s ease-out;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="mensagem"></div>
<input type="button" id="btt" value="Clique para aparecer a mensagem">

And remember to always put this div wherever the message appears and modify the css to your liking. I hope I have helped !!!

    
08.01.2017 / 00:17
6

A simple example with pure JavaScript, since you did not add the JQuery tag.

Add up to 3000 milliseconds. You can change this value if you wish. 

setTimeout(function(){

var a = document.getElementById("div-teste");

a.style="display:none"


}, 3000);
<div id="div-teste">
  Div de teste
</div>
    
08.01.2017 / 00:21
Use AND within an INNER JOIN can? Is it necessary to use the third bind * parameter?