以权利为中心是行不通的

Question

我正在尝试将我的盒子设置为左，上，右和下的动画，当然要居中;但是右边和底部都不起作用！我做错了吗？

$mainMenu.animate({         
    right: 0,
    top: (docHeight / 2) - 100,
    bottom: (docHeight / 2) + 100

}, 500);

由于

Fiddle

Answer 1

Working jsfiddle example

您需要使用top将其发送到底部，然后使用left（减去DIV height或width）将其发送到右侧。否则top在底部仍然等于零，而left在右边仍然等于零，如果这是有道理的：

 $('#link1 a').click(function() {
        console.log('docHeight/2',docHeight/2)
        $mainMenu.animate({
            top: (docHeight / 2) - 100,  
             bottom: (docHeight / 2) + 100,
            left: 0           
        }, 500);
    });

    $('#link2 a').click(function() {
        $mainMenu.animate({
            top: 0,
            right: (docWidth / 2) + 100,
            left: (docWidth / 2) - 100
        }, 500);
    });

    $('#link3 a').click(function() {
        $mainMenu.animate({         
            left: (docWidth - $mainMenu.width()),
            top: (docHeight / 2) - 100,
            bottom: (docHeight / 2) + 100

        }, 500);
    });

    $('#link4 a').click(function() {
        $mainMenu.animate({           
            top: (docHeight - $mainMenu.height()),
            right: (docWidth / 2) + 100,
            left: (docWidth / 2) - 100
        }, 500);
    });