Показать сообщение отдельно
  #5 (permalink)  
Старый 22.04.2015, 17:28
Профессор
Отправить личное сообщение для tsigel Посмотреть профиль Найти все сообщения от tsigel
 
Регистрация: 12.12.2012
Сообщений: 1,398

<style>

  .block.moved {
    left: 200px;
  }

 .block {
     background: red;
     width: 20px;
     height: 20px;
     position: absolute;
     left: 0;
     top: 35px;
     transition: left 1s ease;
     -webkit-transition: left 1s ease;
     -moz-transition: left 1s ease;
     -o-transition: left 1s ease;
     -ms-transition: left 1s ease;
  }

</style>

<div>
  <a>Двигать</a>
  <div class="block"></div>
</div>

<div>
  <a>Двигать</a>
  <div style="top: 65px;" class="block"></div>
</div>
<script>

[].forEach.call(document.querySelectorAll("a"), function (elem) {
elem.addEventListener("click", function () {
  this.parentNode.querySelector(".block").classList.toggle("moved");
}, false)});;

</script>
Ответить с цитированием