我对前端开发非常陌生.我有一张桌子,每一行的高度都是52px.我想用尽可能多的行填充屏幕(并对不适合任意屏幕大小的其余行进行分页).

我知道我必须把一些元素的大小除以52,才能算出这个数值.我不知道的是,我应该在分子中使用哪个元素的大小,或元素的差异,才能可靠地做到这一点.

我有窗口的大小,导航栏的大小,然后是我将在那里有网站的变化内容的主要容器.

我的直觉是,我只需使用主容器大小,减go 页眉和底部页面 Select 栏的大小,就可以得到我的数字,我可以将其用于我的条件.

再说一次,我不确定这是不是一个可靠的方法.如果是这样,有没有办法用Svelte本身来确定这些数字?就像<svelte:window />是怎么工作的?或者,我必须直接依赖DOM吗?

以下是目前为止这个问题的截图:

https://i.stack.imgur.com/rsFgS.png

推荐答案

你的"直觉"是正确的.要在屏幕上填满尽可能多的行,只需执行以下操作:

  $: availableRows = Math.floor((windowHeight - headerHeight - pageSelectBarHeight) / rowHeight);

Javascript相关问答推荐

togglePopover()不打开但不关闭原生HTML popover'

判断表格单元格中是否存在文本框

函数返回与输入对象具有相同键的对象

cypress中e2e测试上的Click()事件在Switch Element Plus组件上使用时不起作用

JS,当你点击卡片下方的绿色空间,而它是在它的背后转动时,

编剧如何获得一个div内的所有链接,然后判断每个链接是否都会得到200?

变量的值在Reaction组件中的Try-Catch语句之外丢失

使用Java脚本导入gltf场景并创建边界框

Reaction Native中的范围滑块

检索相加到点的子项

按什么顺序接收`storage`事件?

Next.js中的服务器端组件列表筛选

如何在和IF语句中使用||和&;&;?

无法设置RazorPay订阅API项目价格

未捕获的不变违规:即使在使用DndProvider之后也应使用拖放上下文

在Java脚本中构建接口的对象

如何在移动设备中使用JAVASSCRIPT移除点击时的焦点/悬停状态

rxjs在每次迭代后更新数组的可观察值

将延迟加载的模块转换为Eager 加载的模块

如何在Web项目中同步语音合成和文本 colored颜色 更改