如何在浏览器工具栏下创建菜单栏使用crossrider

时间:2014-03-16 12:58:08

标签: browser-extension crossrider

我正在使用“CROSSRIDER”创建浏览器扩展,现在我想在工具栏和我们的网站页面之间创建菜单栏,如下图所示 enter image description here

在上图中,您可以观察到菜单栏包含“Congradulations浏览器应用程序已成功安装”文本。 下面,您还可以看到在单个网站上添加菜单栏之前和之后显示的另外两张图片。(我从其他网站上获取这些样本图片仅供参考)

图像 - > 1(添加菜单栏之前)

enter image description here

图像 - > 2(添加菜单栏后)

enter image description here

在上图中,您可以观察到菜单栏(呈黄色)。现在我想创建一个这样的菜单栏。如何使用CROSSRIDER实现这种情况。

1 个答案:

答案 0 :(得分:1)

您可以使用Extension Page Scope中的常规JS DOM或jQuery代码来实现此目的。 因此,为了帮助您入门,您可以在 extension.js 文件中使用以下内容:

appAPI.ready(function($) {
  $('<div id="my-toolbar"></div>').
    css({
      "background-color":"wheat",
      height:"50px",
      left:0,
      position:"fixed",
      top:0,
      width:"100%"})
    .appendTo('body');
});

[披露:我是Crossrider员工]