追加div会导致元素滚动到底部

Question

所以我试图在我的应用程序中将一个广告框添加到div的底部，但大多数情况下，当广告加载时会导致div滚动到底部。

我正在使用的广告服务Chitika为我提供了HTML片段。所以我只是将片段添加到我的骨干模板中，每当我显示一个视图时，脚本就会运行并加载一个广告。

例如，这是我模板的底部：

<div class="ad-box">
    // Script they gave me. 
    // I edited it to append to the .ad-box div instead of the body
    <script type="text/javascript">
        ( function() {
             ...
             $('.ad-box').append('<div id="chitikaAdBlock-' + placement_id + '"></div>');
             ...
             }());
    </script>

</div>

在显示视图后加载广告需要一秒钟，但是当它显示时，大多数情况下会导致页面跳转到底部。有谁知道为什么？

如果有帮助的话，这是我的项目样式：

    .ad-box {
        text-align: center;
        width: 640px;
        height: 90px;
        padding-bottom: 30px;
        margin-bottom: 60px;
    }

    .chitikaAdBlock {
        margin-left:auto;
        margin-right:auto;
    }
    .chitikaAdContainer {
        height: 90px;
    }

附加后的添加内容如下：

<div id="chitikaAdBlock-3" class="chitikaAdContainer">
   <iframe class="chitikaAdBlock" frameborder="0" height="60" id="ch_ad3-0" marginheight="0" marginwidth="0" scrolling="no" src="about:blank" width="468" style="margin: 0px; padding: 0px;">
   </iframe>
 </div>