Показать сообщение отдельно
  #4 (permalink)  
Старый 23.04.2017, 22:56
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,070

AlekSay,
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
    <title></title>
    <link type="text/css" rel="stylesheet" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  </head>
<style>
#block{
  position:absolute;
  left:300px;
  top:50px;
  width:100px;
  height:100px;
  background-color:black;
  transition: left .8s ease-in-out;
}
#button{
  position:absolute;
  top:200px;
  width:150px;
  height:100px;
  background-color:red;
}
#block.anime{
  left: 0;
}

</style>
 <script>
$(function() {
    $("#button").on("click", function() {


        $('#block').toggleClass("anime");

})
});
  </script>
<body>
<div id="button"></div>
<div id="block"></div>
</body>
</html>
Ответить с цитированием