0

我正在使用 durandal 和 twitter-bootstrap，我有一个页面，在其中我有一个模式弹出窗口。模态弹出窗口的代码类似于：

<div id="reportModal" class="messageBox messageBox-fixedSize">
    <div class="modal-header">        
    </div>    
    <div class="modal-body" >          
    </div>
    <div class="modal-footer ">
    </div>
</div>

这个在 chrome 中的结果是这样的：

<div id="reportModal" class="messageBox messageBox-fixedSize ui-draggable" data-view="views/Reports/reportWindow" style="position: relative; margin-top: -151.05555534362793px; margin-left: -395.55555534362793px;" data-active-view="true">
<div class="modal-header">
</div>    
<div class="modal-body">
</div>
<div class="modal-footer ">

</div>

结果的有趣之处在于从 dialog.js（使用 compositionComplete 方法）为 durandal 更改的样式属性。

style="position: relative; margin-top: -151.05555534362793px; margin-left: -395.55555534362793px;"

如果我们去compositionComplete，关于这个方法的注释是：“这个函数是在modal完全合成到DOM之后调用的，允许你的实现做任何最后的修改，比如定位或者动画。你可以获得原始的对话框对象通过getDialog在 context.model 上使用。”

我的问题是如何基于此方法添加新位置（到页面顶部）？

任何帮助都会受到赞赏。

4

1 回答 1

2

最后我使用了 compositionComplete

public compositionIsCompleted(){
    var styles = {
        'position': 'absolute',
        'margin-top': '-360px',            
        'margin-left':'-250px'
    };

    $("#reportModal").css(styles);
}

我希望对其他人有所帮助。

于 2013-11-07T21:24:05.247 回答