Question

我很感激任何建议。

我有一个剑道窗口：

@(Html.Kendo().Window()
.Name("detailsWindow")
.Title("..")
.Content("...")
.Draggable()
.Visible(false)
.Width(1350)
.Height(450)
.Resizable(r =>r.Enabled(true))    
)

我用处理程序打开它：

<script>
    function Documents_Change(e)
    {
        var selected = this.select()[0],
          item = this.dataItem(selected);

        var window = $("#detailsWindow");

        window.load("@Url.Action("Details", "CustomEntry")" + "?gtdNo=" + item.ID);

        window.data("kendoWindow").center().open();
    }
</script>

当我尝试调整窗口大小时，我的内容会调整其大小到窗口。我想阻止它，它应该有滚动条。

谢谢！

Answer 1

您应该将宽度设置为窗口的顶部元素（不是窗口本身），并且为此元素设置所需的width和overflow-x设置为hidden。< / p>

示例：给出以下HTML

<div id="window">
    <div id="top-inner">
        <p> Content of the window</p>
        ...
    </div>
</div>

您应该定义以下CSS样式：

#top-inner : {
    width: 550px;
    overflow-x: hidden;
}

请参阅以下代码段（尽管它在JavaScript中为您提供了这个想法）。

$(document).ready(function() {
  $("#window").kendoWindow({
    width: "450px",
    title: "About Alvar Aalto"
  });
});

html {
  font-size: 12px; 
  font-family: Arial, Helvetica, sans-serif; 
}

#top-inner {
  width: 400px;
  overflow-x: hidden;
}

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.common.min.css" />
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1316/styles/kendo.default.min.css" />
<script src="http://cdn.kendostatic.com/2014.3.1316/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.3.1316/js/kendo.all.min.js"></script>

<div id="window">
  <div id="top-inner">
    <p>Alvar Aalto is one of the greatest names in modern architecture and design. Glassblowers at the iittala factory still meticulously handcraft the legendary vases that are variations on one theme, fluid organic shapes that let the end user decide the use. Interpretations of the shape in new colors and materials add to the growing Alvar Aalto Collection that remains true to his original design.</p>

    <p>Born Hugo Alvar Henrik Aalto (February 3, 1898 - May 11, 1976) in Kuortane, Finland, was noted for his humanistic approach to modernism. He studied architecture at the Helsinki University of Technology from 1916 to 1921. In 1924 he married architect Aino Marsio.</p>

    <p>Alvar Aalto was one of the first and most influential architects of the Scandinavian modern movement, and a member of the Congres Internationaux d'Architecture Moderne. Major architectural works include the Finlandia Hall in Helsinki, Finland, and the campus of Helsinki University of Technology.</p>

    <p>Source: <a href="http://www.aalto.com/about-alvar-aalto.html" title="About Alvar Aalto">www.aalto.com</a></p>
  </div>
</div>

Kendo窗口：防止将内容调整为窗口大小

1 个答案: