Opera15扩展:浏览器按钮(button-popups-badges)
本文根据 Opera 官方文档编写,介绍扩展中“浏览器按钮”相关的内容。
Opera 扩展中按钮有两种形式,一种是 Browser Action,一种是 Page Action。
Browser Action 针对的是整个浏览器,可以控制窗口内的所有标签。Page Action 则只对当前显示的标签有效,所以它是显示在地址栏内的。
创建按钮
只需在 manifest.json
文件中声明
"browser_action": {
"default_icon": "icon.png",//图标
"default_title": "my button",//提示
"default_popup": "popup.html"//弹出内容
}
"page_action": {
"default_icon": "icon.png",
"default_title": "My Sample Extension",
"default_popup": "popup.html"
},
按钮徽章(badges)
在按钮右下角可以显示一些文字,相关属性应该在后台脚本(background.js)中设置,Page Action 没有这个特性。
Chrome.browserAction.setBadgeBackgroundColor({"#ff0000"}): //设置背景颜色
Chrome.browserAction.setBadgeText("hell")//设置文字,最多4个字符
按钮点击事件
监听按钮点击事件的代码同样需要写在在后台脚本中
chrome.browserAction.onClicked.addListener(function(){
console.log('This button was clicked!');
});
按钮弹出内容(popups)
弹出内容显示的就是一个 html 页,在 manifest.json
文件中声明就可以了
显示 Page Action
Page Action 默认是不显示的,通过 show()
方法显示,隐藏则是 hide()
方法。虽然它只对当前显示的标签有效,但要显示/隐藏还是需要传入当前标签的ID
//如果地址中包含123则显示 Page Action
function checkURL(tabID, changeInfo, tab){
if (tab.url.indexOf('123')> -1){
chrome.pageAction.show(tabID);
}
}
chrome.tabs.onUpdated.addListener(checkURL);//监听当前显示标签改变
标签:扩展