Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Gostaria de saber se alguém tem alguma ideia de como eu possa colocar um menu ao lado direito.
Ao passar o mouse ele abre faz um efeito de estar subindo.
segue uma imagem de exemplo
Obrigado desde já!
/applications/core/interface/imageproxy/imageproxy.php?img=https://image.ibb.co/ivfRAR/teste.png&key=c964d95a98c5fbc563f1991d1bffd9ffd110043b06078d550cdf0090d269c1ad" width="337" />
>
Em 22/12/2017 at 23:44, Omar~ disse:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="jquery-3.2.1.js" type="text/javascript"></script>
<title></title>
<script type="text/javascript">
$(document).ready(function () {
var $ativa = $('.mostra');
var $elemento = $('.elemento');
$ativa.mouseenter(function () {
if ($elemento.hasClass('add-efeito')) {
return false;
} else {
$elemento.addClass('add-efeito');
}
});
$ativa.mouseleave(function () {
if ($elemento.hasClass('add-efeito')) {
$elemento.removeClass('add-efeito');
}
});
});
</script>
<style>
div.mostra {
background-color: #777777;
padding: 2rem
}
div.elemento {
background-color: #000000;
height: 35rem;
width: 16rem;
position: fixed;
bottom: 0;
right: 0;
display: none
}
div.elemento.add-efeito {
display: block;
animation: efeito .5s
}
@keyframes efeito {
from {
bottom: -35rem
} to {
bottom: 0
}
}
</style>
</head>
<body>
<div class="mostra">Passe o mouse por cima</div>
<div class="elemento"></div>
</body>
</html>
Obrigado!
você tem alguma ideia de como faço pra meu objeto parar ao passar o mouse , na hora de subir?
<!DOCTYPE html>