基于CSS规则的SlickGrid行高(SlickGrid row height based on CSS rule)

基于CSS规则的SlickGrid行高(SlickGrid row height based on CSS rule)

目前我正在以编程方式设置SlickGrid槽选项中行的高度：

var options = { rowHeight: 30 };

有没有办法通过CSS规则可以做到这一点而不修改光滑网格默认实现？

我问这个因为我不想根据CSS媒体查询设置行高。

我最初的想法是以编程方式读取CSS属性（类似这样 ）并设置如下的readen值：

var options = { rowHeight: readRowHeightCSSValue() };

......但我不确定这是不是最好的主意。

Currently I am setting the height of the rows in SlickGrid trough options programatically:

var options = { rowHeight: 30 };

Is there any way I could do it trough CSS rule without modifying slick-grid default implementation?

I am asking this becaous I wan't to set row height based on CSS Media Queries.

My initial idea was to read CSS property programatically (something like this) and set readen value like that:

var options = { rowHeight: readRowHeightCSSValue() };

...but I am not sure whether this is best idea.

最满意答案

只需根据窗口宽度设置行高。

rowHeight: $(window).width() < 1024 ? 30 : 15

I solved my issue with a little bit different approach as I initially tought, so I am sharing my solution that worked for me.

I used enquire.js with same CSS media queries as in my stylesheets:

enquire.register("only screen and (max-width: 1024px)", { match : function() { slickGridInitialRowHeight = 15; } }).fire(); enquire.register("only screen and (min-width: 1024px)", { match : function() { slickGridInitialRowHeight = 30; } }).fire();

... after that, I used slickGridInitialRowHeight to initialize SlickGrid.