Size of Chrome notifications

丶灬走出姿态 提交于 2019-12-13 19:13:45

问题


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?


回答1:


maximum size on Windows Version 20.0.1132.47 (stable 144678) is 300 by 160 pixels.




回答2:


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>


来源:https://stackoverflow.com/questions/10761641/size-of-chrome-notifications

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!