javascript 在展开的剑道下拉菜单上设置CSS样式属性

5jvtdoz2 于 2023-05-27 发布在 Java

关注(0)|答案(1)|浏览(126)

我的列表有所不同，但https://demos.telerik.com/kendo-ui/dropdownlist/index是一个很好的起始参考
我需要设置剑道下拉列表的最大高度。该列表没有页眉，只有N个元素和一个页脚，页脚中包含一个用于添加更多元素的按钮。经过一定的阈值，比如8个项目，我希望它打开垂直滚动条，并将高度固定在这个最大值。我不挑剔的确切高度，但它可能是约400 px。
我可以并且已经设置了“高度”选项，但是在一定的阈值之后，页脚会位于项目列表的下面（和外面）。剑道高度似乎没有考虑到脚的高度，但不能肯定。
Kendo决定将内容放在与原始选择器完全分离的区域中。不幸的是，我需要样式化这个单独的HTML。也就是说，我想对div.k-animation-container和下面的内容进行样式化。而且，最重要的是，我希望不同的下拉菜单样式不同，所以我不能使用通用的样式。
如何设置从.k-animation-container派生的剑道元素的样式？
目前，我通过在页脚添加一个id来作弊，找到它并查找最接近的.k-animation-container。但是我想直接对.k-animation-container进行样式化。
我不确定这是否相关，但我使用Angular构建了这个剑道下拉组件。

JavaScript

来源：https://stackoverflow.com/questions/76329736/set-css-style-attributes-on-expanded-kendo-drop-down

1条答案

按热度按时间

xriantvc1#

我不认为你可以直接获得动画容器（除非页面上只能有一个）。您可以通过使用下拉控件的.popup属性来避免插入ID。例如，处理open事件：

open: function(e) {                      
   var $pop = e.sender.popup.element;                      
   $pop.closest('.k-animation-container').css('height', 'auto');
   $pop.css('height', 'auto');
   $pop.find('.k-list').css('height', 'auto').css('max-height', '400px');                      
}

这是一个**DEMO**
更改'NumberOfItems'变量以查看下拉高度的增长，直到最大值为400px。

赞(0）回复(0）举报 2023-05-27

我来回答

javascript 在展开的剑道下拉菜单上设置CSS样式属性

1条答案

相关问题

热门标签

最新问答