Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 31.01.2016, 00:07
Интересующийся
Отправить личное сообщение для raffx Посмотреть профиль Найти все сообщения от raffx
 
Регистрация: 14.05.2012
Сообщений: 20

Как остановить следование за курсором
При клике по div он начинает двигаться за указателем. Подскажите пожалуйста, как при следующем клике в любой области остановить следование за курсором и плавно вернуть div в изначальную позицию?

Пример в jsfiddle
Пример на сайте (надо кликнуть в пиксельный самолетик в правом нижнем углу)
Ответить с цитированием
  #2 (permalink)  
Старый 31.01.2016, 00:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,077

raffx,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">

  div.active {
    background-color: #FFFF00;
     transition: none;
  }
div{
  width: 70px;
  height: 140px;
  background: green;
  position: absolute;
  left: 0;
  top: 0;
  transition: all 1.8s ease-out;
}
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

  <script>
 $(function() {
    $(window).on("mousemove", function(pos) {
        $(".active").css({
            "left": pos.pageX + "px",
            "top": pos.pageY + "px"
        })
    });
    $(window).on("click", function(event) {
        if ($("#main").is(".active")) $("#main").removeClass("active").removeAttr("style");
        else if ($(event.target).is("#main")) $("#main").addClass("active")
    })
});
  </script>
</head>

<body>
<div id="main" >Click me!</div>


</body>

</html>
Ответить с цитированием
  #3 (permalink)  
Старый 31.01.2016, 00:58
Интересующийся
Отправить личное сообщение для raffx Посмотреть профиль Найти все сообщения от raffx
 
Регистрация: 14.05.2012
Сообщений: 20

рони,
благодарю вас, прекрасно работает!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как остановить функцию? vladimir7517 jQuery 10 11.10.2013 13:17
Управление скроллом "а-ля тач" HonesT Элементы интерфейса 2 27.08.2013 14:25
Как остановить выполнение скрипта до загрузки библиотеки? HaseProgram jQuery 3 23.02.2013 22:03
Как сделать как в JQ? faforty Общие вопросы Javascript 8 14.11.2011 01:35
Как вставить текст под курсором GogElf Общие вопросы Javascript 1 13.04.2009 07:10