使用div的位置移动的jquery动画

时间:2012-10-13 08:25:46

标签: jquery html css

我正在创建div的动画为http://tententen.in/

$(document).ready(function(){
    $('#home-top').click(function() {
        $('#top').animate({
            marginTop: '50px'
        },500);
    });
    $('#home-right').click(function() {
        $('#left').animate({
            marginLeft: '-100%'
        },'fast');
        $('#right').animate({
            marginRight: '33%'
        },'fast');
    });
    $('#home-left').click(function() {
        $('#left').css({'position':'relative'}).animate({ left:'33%' },'fast');
        $('#home-container').css({ 'position': 'relative'}).animate({ left:'33%' },'fast');
        $('#right').css({'position':'relative'}).animate({ right:'-33%' },'fast');
    });
});

在我的剧本中,这里只有三个div。我只需要左边的动画.. 我试过但有些事情出错......

http://jsbin.com/amimih/1/

1 个答案:

答案 0 :(得分:0)

您可以使用此代码代替左侧

var pos = $(this).position();
"margin-left" : pos.left or etc;
or
left : pos.left or etc;

并使用此代码代替marginRight

"margin-right":"30px"

或者您可以在css文件中使用position:relative