Jquery动画效果与每个

Js小提琴：

我在一页上有5个气泡。最初，我加载气泡到3倍大小。将我的动画悬停到200px时，widh正在工作。我想要我的代码是在加载所有气泡到30px后，我想一个一个地将气泡设置为200px的宽度。这应该发生在所有的一组滑块上。这样地。。。我试过的是

            $(document).ready(function () {
                var t = 200;
                $('.box').animate({
                    width: '30px',
                    opacity: '1',
                    height: '30px',
                    marginLeft: '-15px',
                    marginTop: '-15px'
                }, 2000);
                $('.box').each(function () {
                    alert(t);
                    $(this).stop(true, false).animate({
                        width: '200px',
                        height: '200px',
                        marginLeft: '-105px',
                        marginTop: '-105px',
                        fontSize: '40px',
                        opacity: '1',
                    }, 200).addClass('sachin').find("strong").css("display", "block").delay(50);
                    $(this).stop(true, false).animate({
                        width: '30px',
                        height: '30px',
                        marginLeft: '-15px',
                        marginTop: '-15px',
                        fontSize: '20px',
                    }, 300).removeClass('sachin').find("strong").css("display", "none").delay(50);
                });
                $('.box').hover(function () {
                    $(this).stop(true, false).animate({
                        width: '200px',
                        height: '200px',
                        marginLeft: '-105px',
                        marginTop: '-105px',
                        fontSize: '40px',
                        opacity: '1',
                    }, 300).addClass('sachin').find("strong").css("display", "block");
                }, function () {
                    $(this).stop(true, false).animate({
                        width: '30px',
                        height: '30px',
                        marginLeft: '-15px',
                        marginTop: '-15px',
                        fontSize: '20px',
                    }, 300).removeClass('sachin').find("strong").css("display", "none");
                });

我的悬停效果很好

HTML是

            <div id="page">
            <div style="position:absolute; left:300px; top:300px;">
                <div class="box box1"><span>1</span> <strong style="display:none;"> I am awesome! </strong> </div>
            </div>
            <div style="position:absolute; left:600px; top:300px;">
                <div class="box box2">1</div>
            </div>
            <div style="position:absolute; left:900px; top:300px;">
                <div class="box box3">1</div>
            </div>
            <div style="position:absolute; left:300px; top:600px;">
                <div class="box box4">1</div>
            </div>
            <div style="position:absolute; left:600px; top:600px;">
                <div class="box box5">1</div>
            </div>
        </div>
                    <div id="page2" style="display:none;">
                        <div style="position:absolute; left:300px; top:300px;">
                            <div class="box box1 "><span>2</span> <strong style="display:none;"> I am awesome! </strong> </div>
                        </div>
                        <div style="position:absolute; left:600px; top:300px;">
                            <div class="box box1 ">2</div>
                        </div>
                        <div style="position:absolute; left:900px; top:300px;">
                            <div class="box box1 ">2</div>
                        </div>
                        <div style="position:absolute; left:300px; top:600px;">
                            <div class="box box1 ">2</div>
                        </div>
                        <div style="position:absolute; left:600px; top:600px;">
                            <div class="box box1 ">2</div>
                        </div>
                    </div>

我太棒了
1.
1.
1.
1.
2我太棒了
2.
2.
2.
2.

---

请帮助制作动画。我的悬停效果很好。

？提到类“sachin”jsfiddle我想在所有圆圈设置动画到初始级别后运行悬停效果。