jQuery动画按比例扩展 [英] jQuery animate expand proportionally

问题描述

我现在遇到有关如何在jQuery中对动画进行动画功能以按比例扩展的问题.通常，它只向一侧扩展，就像向底部扩展或向右扩展一样.

I'm now in problem about how to animate function in jQuery to expand proportionally. Normally, it expand one-sided only just like expand to bottom or expand to right.

我想要的是通过使用动画来按比例从左上右下扩展.

What I want is to expand proportionally left-right-top-bottom by using animate.

以下是我的编码.我在上面说的只是扩展到底部.

Following is my coding. What I said above, it expand to bottom only.

$(document).ready(function() {
    var theFrame = $("#FrmPatient", parent.document.body);
    theFrame.animate({width: 650, height: 485}, 1000);
});         

推荐答案

尝试一下:

<div id="frame"></div>

#frame {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -100px 0 0 -100px;
    width: 200px;
    height: 200px;
    background-color: #999;
}

$(function() {
    var w = 400, h = 400;
    $("#frame").animate({
        width: w,
        height: w,
        marginLeft: -w/2,
        marginTop: -h/2
    }, 1000);
});

http://jsfiddle.net/GVj83/

这篇关于jQuery动画按比例扩展的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！