小编Pra*_*eek的帖子

Google Chrome套餐应用:如何制作透明的圆形背景,例如google hangout app？

如下面的屏幕截图所示,环聊应用程序是完全透明的,并且它也应用了背景阴影.

环聊应用

我尝试了几种没有运气的方法,将css样式应用于页面的"html"和"body"标签,并在创建新窗口时使用"frame:none"选项,但它不起作用.

如何制作像这样的Google Chrome包应用？

任何人都有任何想法？

这是我正在尝试的代码.

mainfest.json:

{
  "manifest_version" : 2,
  "name" : "Demo App",
  "version" : "0.1",

  "description" : "Demo Purpose",
  "app" : {
    "background" : {
      "scripts" : ["background.js"]
    }
  },
  "permissions" : ["experimental"]
}

Run Code Online (Sandbox Code Playgroud)

background.js:

chrome.app.runtime.onLaunched.addListener(function() {
    chrome.app.window.create("index.html", {
        frame: "none",
        id: "DemoWindow",
        resizable : false,
        innerBounds : {
            left: 600,
            maxWidth: 150,
            maxHeight: 150
        }
    });
});

Run Code Online (Sandbox Code Playgroud)

index.html:

<!DOCTYPE html>
<html>
<head>

    <style type="text/css">
        .title-area {
            -webkit-app-region: drag;
        }
        html, body {
            margin: 0;
            padding: …

Run Code Online (Sandbox Code Playgroud)

html javascript css google-chrome google-chrome-app

Pra*_*eek

lucky-day

11
推荐指数

1
解决办法

2651
查看次数