Question

我创建了一个onclick函数。所以这个函数的作用是将border，width和height放到我的div类框中，然后这个fake_box将移动到右上角。但是，下面的功能只会将我的fake_box移动到左上角。我试图改变.animate - 顶部和左边，但它仍然移动到左上角。有什么我错过了下面的功能？将我的fake_box移动到右上角的任何解决方案？

非常感谢！

function click_test(){
    $('.fake_box').css({'border' : '5px solid #000000' ,  'width' : "440" , 'height' : "280"});
    $('.fake_box').animate({top: '-=30px', left: '+=100px', width: '0', height: '0'}, 1000, function(){
            $('.fake_box').css({'border' : 'none' ,  'width' : "440" , 'height' : "280"});
    }); 

}

Answer 1

尝试更改设置fake_box absolute或fixed的位置 DEMO HERE

CSS

.fake_box{
    position: fixed;
    width: 440px;
    height: 280px;
    border: 1px solid grey;
    right: 0;
    top: 0;
}

JS

    $('.fake_box').click(click_test);

    function click_test(){
        $('.fake_box').css({
            'border' : '5px solid #000',  
            'width' : "440", 
            'height' : "280"
        });
        $('.fake_box').animate({
           top: '-=30px', 
           right: '+=100px', 
           width: '0', 
           height: '0'}, 1000, 
           function(){
              $('.fake_box').css({'border' : 'none' ,  'width' : "440" , 'height' : "280", 'top':'0','right':'0'});
        });    
    }

jquery .animate将假盒移到其他方向

1 个答案: