Mouseover hover time CSS HTML

Question

my problem is I hope easy. I have mouseover hover that shows some text.

My question is, that is there any chance to make this hover last few seconds, after mouse is gone? I can use only html+css.

Answer 1

This cannot be a perfect answer. Because, the perfect answer would be No. You can do a delay in transition, by the way.

div {
  display: inline-block;
  padding: 5px;
  margin: 10px;
  border: 1px solid #ccc;
  transition: 0s background-color;
  transition-delay: 1s;
}
div:hover {
  background-color: red;
  transition-delay: 0s;
}

<div>Hover Me</div>

Source: http://dabblet.com/gist/1498446

Answer 2

.example {
transition: 0s;  /* zero it if you don't want to add a fade */
transition-delay:2s; /* delay will last for 2 seconds */
}

.example:hover {
background-color:blue;
transition-delay:0s; /* the delaying happens here */
}