2

Как сделать, чтобы при нажатии на кнопку блок начал плавно перемещаться вправо и одновременно как бы растворяясь исчезнул?

<div style="width:200px;height:100px;border:1px solid black;" class="disolved"></div>
<button>растворить блок</button>

Js

$('button').click(function(){
  //что делать?
  });

1 ответ 1

2

$('button').click(function() {
  $(".block").addClass("slide-and-hide");
});
.block {
  width: 200px;
  height: 100px;
  border: 1px solid black;
  background: green;
}
.slide-and-hide {
  opacity: 0;
  margin-left: calc(100% - 200px);
  transition: opacity 3s, margin-left 3s;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="block"></div>
<button>растворить блок</button>

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.