Tricky Button Moving Away when Mouseover in Javascript?

30,189

This is probably what you are looking for:

$(function() {
  $("button").on({
    mouseover: function() {
      $(this).css({
        left: (Math.random() * 200) + "px",
        top: (Math.random() * 200) + "px",
      });
    }
  });
});
button {
  position: absolute;
  top: 10px;
  left: 10px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button>button</button>

http://jsfiddle.net/9CDtE/4/

Share:
30,189
HP.
Author by

HP.

Updated on June 15, 2021

Comments

  • HP.
    HP. about 3 years

    I remember seeing some website or script on the web about this funny / tricky button: Basically it's a button that is impossible to click. When mouseover, it moves randomly away.

    Can someone point me to a source or show me few line of code to do that? Preferably using jQuery.

  • Gautam
    Gautam almost 12 years
    Simply for the reason that ,that guy was getting a lot of bad press, So atleast I would help him out . I was just being nice
  • Barrie Reader
    Barrie Reader almost 12 years
    Vote up for being nice! More people need to I guess.
  • Barrie Reader
    Barrie Reader almost 12 years
    p.s. I managed to click that button twice ;)
  • Dr. Dan
    Dr. Dan almost 12 years
    Well...congratulations...you got +10!
  • Gautam
    Gautam almost 12 years
    Thank you, nice of you to do that .
  • psychobunny
    psychobunny over 10 years
    Needs higher random numbers, too easy to click ;) But yeah +1 because I was googling for this :p
  • Ben Duffin
    Ben Duffin about 8 years
    +1 - I was also looking for this exact question ( even if it was only to annoy a staff member for a laugh )