javascript - 使用 Meteor 为特定页面/路由指定 'html, body' css 设置

标签 javascript html css meteor iron-router

我正在尝试调整 Meteor 应用程序中特定路线/页面的一些页面背景 CSS 设置。我可以通过使用 Template.template.rendered/destroyed 和 jQuery 选择器在模板渲染后注入(inject) css 来做到这一点,如下所示:

Template.template.rendered = function() {
  $('html, body').css({
    "background-color": "#fdfdfd",
    ...additional css properties
  };
};

Template.template.destroyed = function() {
  $('html, body').css({
    "background": "none"
  };
};

我想知道是否有人知道更好的方法来做到这一点。看起来有点慢,当使用浏览器上的后退按钮返回页面时,页面似乎卡住了大约 5 秒。在 Hook 之前/之后使用铁路由器是否更好?我对它们不太熟悉,但缓慢似乎是浏览器问题。我的想法是之前/之后的钩子(Hook)将有助于解决这个问题。除了这两种方法还有其他选择吗?谢谢。

最佳答案

除非您真的真的需要以特定于某些页面的方式将样式直接附加到htmlbody元素,我强烈建议将每个整个页面包装在一个带有 width: 100vw;height: 100vh; 以及适当的 id 的 div 中,并且然后使用后者直接使用 css 进行样式设置。

如果您确实需要直接附加到htmlbody元素,您是否尝试过使用onAfterAction来做到这一点 钩在iron-router中吗?考虑到样式取决于路线而不是模板,这似乎是一个更好的地方(尽管 Blaze 意味着您可能可以摆脱正在做的事情)。

关于javascript - 使用 Meteor 为特定页面/路由指定 'html, body' css 设置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23221411/

相关文章:

javascript - 调用两个方法一次

javascript - jQuery 日期选择器与输入文本字段错误相关

css - 将 DIV 拉伸(stretch)至窗口的 100% 高度和宽度,但不小于 800x600px

html - apache 中的文件夹不解释 html

javascript - 未捕获的 ReferenceError : show_pic is not defined at file:///android_asset/www/index. html:27

css - 多个@Font-Face

javascript - Nodejs session 未定义

javascript - 如何在通过单击 "clear"按钮清除过滤器后刷新数据表

javascript - 打开带有发布数据的弹出窗口

javascript - 可视化 html5 Canvas