kendo ui 窗口未正确居中 [英] kendo ui window not centering correctly

问题描述

我遇到了剑道窗口无法正确居中的问题.

这是一个演示问题的简单小提琴.所以在没有浏览器垂直滚动条的情况下，剑道窗口有显示的空间，但剑道窗口居中方法，将其置于中心之外，并强制出现浏览器滚动条.

小提琴:http://jsfiddle.net/codeowl/QKPN6/2/

HTML:

<p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p><p>这里是测试内容 这里是测试内容</p>

JavaScript:

$(document).ready(function() {var oWin = null;$('#testWindow').kendoWindow();oWin = $('#testWindow').data('kendoWindow');oWin.center();});

请告诉我如何让剑道窗口正确居中.

解决方案

我觉得问题解决了 :) 试试.

$(document).ready(function() {var oWin = null;var h = window.innerHeight;$('#testWindow').kendoWindow({});oWin = $('#testWindow').data('kendoWindow');oWin.center().open();$('#testWindow').closest(".k-window").css({顶部:h/2 - $('#testWindow').parent()[0].scrollHeight/2});});

JSFiddle

I have an issue that the Kendo Window does not center correctly.

Here is a simple fiddle that demonstrates the issue. So there is room for the kendo window to show without the browser vertical scroll bar, but the kendo window center method, puts it off center, and forces the browsers scroll bar to appear.

Fiddle: http://jsfiddle.net/codeowl/QKPN6/2/

HTML:

<div id="testWindow">
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
    <p>here is the test content here is the test content</p>
</div>

JavaScript:

$(document).ready(function() {
    var oWin = null;
    $('#testWindow').kendoWindow();
    oWin = $('#testWindow').data('kendoWindow');
    oWin.center();
});

Please show me how I can get the kendo window to center correctly.

解决方案

I think the problem is solved :) Try.

$(document).ready(function() {
    var oWin = null;
    var h = window.innerHeight;
    $('#testWindow').kendoWindow({});
    oWin = $('#testWindow').data('kendoWindow');
    oWin.center().open();
    $('#testWindow').closest(".k-window").css({
        top: h/2 - $('#testWindow').parent()[0].scrollHeight/2
    });
});

JSFiddle

这篇关于kendo ui 窗口未正确居中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！