Грубо говоря есть некий блок , частично скрытый через позиционирование. По клике по нему , он должен плавно выезжать, чтобы становилась видимой вся его скрытая часть. И по повторному клику опять уезжать)
<html>
<head>
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet" href="main.css"/>
<script src="jquery.js"></script>
<script>
$(function(){
$('#popup').click(function(){
$('#popup').animate({
'bottom':'0'
},3000);
});
});
</script>
</head>
<body>
<div id="popup">
<form>
<h3>Приветствие</h3>
<input />
<input />
<button> Отправить </button>
</form>
</div>
</body>
</html>
*{
box-sizing: border-box;
}
#popup{
padding-left: 10px;
background: yellow;
height: 500px;
width: 300px;
position: fixed;
bottom: -440px;
right: 0;
border: 1px solid black;
}
input{
margin: 15px;
margin-left: 50px;
}