Chrome通知的大小 [英] Size of Chrome notifications

查看:101
本文介绍了Chrome通知的大小的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在构建一个使用createHTMLNotification调用提供用户通知的扩展,但我在计算相关大小限制时遇到了一些问题,以避免出现丑陋的黑色水平和垂直滚动条(至少在Ubuntu 12.04 Linux上)。



有没有人有任何指向文档的提示,指出我应该瞄准的最大尺寸,希望跨平台?解决方案

在运行Linux版21.0.1145.0版本的Chrome的笔记本电脑上进行的实验给出了滚动条出现前的最大尺寸为284 x 144像素。我不知道这是否是系统特定的,但假设Chrome至少在某些平台上支持原生通知,但我认为将过多的精力投入到像素完美的通知中可能无法保证良好的效果。



至于确保滚动条不会出现在通知中,还有一个小的挑战(可能根本不涉及通知API);设置高度 max-height (并且类似于宽度)不会自行削减它。



在我的情况下,我需要在通知中设置项目列表的样式,并且我最终所做的是使用以下html代码:

 < html> 
< head>
< style>
body {
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:.73em;
}
div#note {
overflow:hidden;
height:144px;
max-height:144px;
width:284px;
}
div.noteline {
position:relative;
overflow:hidden;
overflow-x:hidden;
overflow-y:hidden;
white-space:nowrap;
文本溢出:省略号;
line-height:1.2em;
}
< / style>
< / head>
< body>
< div id = \note \>#{params.html}< / div>
< / body>
< / html>

我的模板引用(#{params.html} )基本上用包含以下内容的行填充:

 < div class =noteline>一些可能的大行溢出项目123< / div> 


I am building an extension which give user notifications using the createHTMLNotification call, but I am having some trouble figuring out the relevant size restrictions to avoid getting ugly black horizontal and vertical scrollbars (On Ubuntu 12.04 Linux at least).

Does anybody have any pointers to documentation giving some hints about what maximum sizes I should be aiming for, hopefully cross-platform?

解决方案

Experiments on my own laptop running Chrome on Linux Version 21.0.1145.0 dev give me a maximum size of 284 by 144 pixels before scrollbars appear. I have no idea whether this is system specific or not, but assuming Chrome supports native notifications for at least some platforms that have them, I guess putting too much effort into pixel perfect notifications may not guarantee nice results.

As for making sure the scrollbars do not appear inside the notification, there is another small challenge as well (which maybe is not be related to the notification API at all); setting the height and max-height (and similarily for the width) does not cut it on it's own.

In my case I needed to style a list of items in a notification, and what I ended up doing was using the following html code:

<html>
  <head>
    <style>
      body {
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: .73em;
      }
      div#note {
        overflow: hidden;
        height: 144px;
        max-height: 144px;
        width: 284px;
      }
      div.noteline {
        position: relative;
        overflow: hidden;
        overflow-x: hidden;
        overflow-y: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        line-height: 1.2em;
      }
    </style>
  </head>
  <body>
    <div id=\"note\">#{params.html}</div>
  </body>
</html>

My template references (#{params.html}) is basically populated with rows containing :

<div class="noteline">Some possibly large line that would overflow item 123</div>

这篇关于Chrome通知的大小的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆