Baixar NeoFrag
assinar em

:hover comment ça fonctionne ?

60 visualizações
:hover comment ça fonctionne ?
Zaekof

38 assuntos, 883 respostas

contribuintes doadores
Mensagem não lida
Bonjour ou bonsoir à tous,

Aujourd'hui je viens demander de l'aide envers la communauté de NeoFrag ;)
Je suis actuellement en développement d'un site web, j'ai des lacune a combler en css est j'aimerais savoir si c'est possible de faire un :hover d'une div exemple #test :

#test {
overflow:hidden;
-webkit-border-radius:50px;
-moz-border-radius:50px;
border-radius:50px;
width:70px;
height:70px;
margin-left: 23%;
margin-top: 14%;
box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7);
}

résultat :


avec mon :hover "fait sur photoshop" :

C'est le résultat que je cherche mais je sais pas du tout comment mi prendre avec le :hover :/

Même si vous n'avez pas des compétences de ouff ou autres.. une idée ou autres et la bienvenue !
"N'arrêtez jamais d'apprendre" !
retorno
2 participantes
3 respostas
Gnesis

12 assuntos, 71 respostas

doadores
Mensagem não lida
Alors, pour ton hover rien de très complexe.

Pour avoir ton "modifier" en hover, il suffit de faire une nouvelle div dans la div de l'avatar, que tu met en forme mais ça tu devrais pouvoir gérer, ensuite tu ajoute juste un display:none; à la div créée et tu fais en sorte que quand on passe la souris sur la div avatar, ça affiche ta nouvelle div.

Exemple:

Html:
<div class="avatar">
<div class="modifier_avatar">
</div>
</div>

Css:
.avatar {
ton css
}
.modifier_avatar {
display: none;
}
.avatar:hover .modifier_avatar {
display: block;
}
French Family
Zaekof

38 assuntos, 883 respostas

contribuintes doadores
Mensagem não lida
merci j'ai cherché se soir de mon côté j'ai trouvé une solution qui doit encore être amélioré qui par d’ailleurs du même principe que se que tu me dit !
"N'arrêtez jamais d'apprendre" !
Zaekof

38 assuntos, 883 respostas

contribuintes doadores
Mensagem não lida
voila le résultat du coup :


"N'arrêtez jamais d'apprendre" !
retorno