如何检测DIV的尺寸变化?

我有以下示例html,有一个DIV,其宽度为100%。它包含一些元素。在执行窗口调整大小时,内部元素可能会重新放置,并且div的尺寸可能会更改。我在问是否有可能挂钩div的尺寸更改事件?以及如何做到这一点?我目前将回调函数绑定到目标DIV上的jQuery resize事件,但是,没有控制台日志输出,请参见以下内容:

调整大小之前 在此处输入图片说明

<html>
<head>
    <script type="text/javascript" language="javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
    <script type="text/javascript" language="javascript">
            $('#test_div').bind('resize', function(){
                console.log('resized');
            });
    </script>
</head>
<body>
    <div id="test_div" style="width: 100%; min-height: 30px; border: 1px dashed pink;">
        <input type="button" value="button 1" />
        <input type="button" value="button 2" />
        <input type="button" value="button 3" />
    </div>
</body>
</html>