0

js-

$(".inner").hover(function () {
    $(this).stop(true, false).animate({
        height: "400px"
    });
}, function () {
    $(this).stop(true, false).animate({
        height: "100px"
    });
});

css-

.inner {
    height:100px;
    width:400px;
    background-color:#333;
    margin-bottom:0px;
}

.outer {
    height:400px;
    width:400px;
    background-color:#999;
}

私がやりたいのは、小さなボックスが大きなボックス内の下部に位置合わせされ、アニメーションが上方向に行われることですが、下部とマージン下部は役に立ちません。ここにリンクがあります-

http://jsfiddle.net/4nYW6/

4

2 に答える 2

2

これを試して

.inner {
    height:100px;
    width:400px;
    background-color:#333;
    margin-bottom:0px;
    bottom:0;
    position:absolute;
}

.outer {
    height:400px;
    width:400px;
    background-color:#999;
    position:relative;
}

jsFiddle ファイル

于 2013-06-11T06:06:23.197 に答える