开发者

JavaScript/JQuery event handler problem

Been playing around a bit with JavaScript/JQuery, and made a "shy" button, instead its just a p-tag with a word. It works ok, except the bool goDown doesn't seem to change, so it always goes down. What's wrong with my code?

Also JavaScript debugging in VS2010 doesn't seem to be working very good, is this a known problem?

Thanks in advance!

if (typeof naarBeneden == 'undefined') {
    var goDown = new Boolean(true);
}

$(document).ready(function () {

    $(".moveme").animate({ "left": "+=500px"
    }, 2000);
    $(".moveme").hover(move());
});


function move() {
    if (goDown) {
        $(".moveme").hover(function () {
            $(this).animate({ "top": "+=50px" }, 0)
        });
        goDown = false;
    }
    else {
        $(".moveme").hover(function () {
            $(this).animate({ "top": "-=50px" }, 0)
        });
开发者_如何学运维        goDown = true;
    }
}


The main issue is here:

$(".moveme").hover(move());

You're calling move() not using move as a handler, you need it without the parenthesis, like this:

$(".moveme").hover(move);

Even doing that though, you're assigning a new .hover() handler on each hover event, and I doubt that's really what you're after. It's hard to tell exactly what you're after, but I think this is it:

$(function () {
  var goDown = typeof naarBeneden != 'undefined';
  $(".moveme").animate({ "left": "+=500px" }, 2000);
              .hover(function () {
                $(this).animate({ "top": goDown ? "+=50px" : "-=50px" }, 0);
              }, function() {
                $(this).animate({ "top": !goDown ? "+=50px" : "-=50px" }, 0);
              });
});

This assigns an up then down animation if goDown is true when you hover/leave the element, and it does the reverse if goDown is false.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜