Make a run away button in jQuery

后端 未结 2 1299
清歌不尽
清歌不尽 2021-01-06 00:50

I wanted to create a page with a simple button which runs away from the user when he tries to click it. Lets call it the Run away button?

Is there a simple \'jQuery\

相关标签:
2条回答
  • 2021-01-06 01:04
    $('button').hover(function()
    {
        $(this).css('top', rand(1,1000) + 'px').css('left', rand(1,1000) + 'px');
    });
    

    No plugin needed.

    0 讨论(0)
  • 2021-01-06 01:06

    Catch me if you can

    <button id="theRunAwayButton"></button>
    
    button {
        position: absolute;
           background: url(http://t0.gstatic.com/images?q=tbn:6JxQilywV2GyxM:http://images.clipartof.com/small/7038-Baseball-Mascot-Cartoon-Character-Running-Poster-Art-Print.jpg);
        width: 127px;
        height: 111px;
    }
    
    var width = $(window).width() - 127;
    var height = $(window).height() - 111;
    
    function run() {
        var top = Math.random() * height;
        var left = Math.random() * width;
        $('#theRunAwayButton').css('top', top + 'px').css('left', left + 'px');
    }
    
    $(document).ready(function() {
        $('#theRunAwayButton').mouseover(run);
        $('#theRunAwayButton').mousemove(run);
    });
    
    0 讨论(0)
提交回复
热议问题