[英]Chrome Extension: Change Address bar Button Background color at runtime
Is it possible to change button background color on page load event but so far I did not find any such method at all. 是否可以在页面加载事件中更改按钮背景颜色,但是到目前为止,我根本没有找到任何这样的方法。 If it is not possible then I am happy to use some pre-defined images that loads up after page load.
如果不可能,那么我很乐意使用一些在页面加载后加载的预定义图像。
I have tried the following, without success: 我尝试了以下方法,但没有成功:
script.js script.js
// chrome.browserAction.setIcon("red.png");
chrome.browserAction.setIcon({path:'red.png'});
manifest.json manifest.json
{
"name": "Domain Colors",
"version": "1.0",
"manifest_version": 2,
"content_scripts": [{
"matches": ["http://*/*"],
"js": ["script.js"]
}],
"permissions": [ "tabs", "http://*/*" ],
"browser_action": {
"default_title": "Colry",
"default_icon": "blue.png"
}
}
In order to use the browserAction
API, a background page is required. 为了使用
browserAction
API,需要一个背景页面 。 If you want to keep your current control flow (update icon via a content script), you need to pass messages . 如果要保留当前的控制流(通过内容脚本更新图标),则需要传递消息 。 Here's the bare minimum:
这是最低要求:
// script.js
chrome.extension.sendMessage('');
// background.js
chrome.extension.onMessage.addListener(function(message, sender) {
chrome.browserAction.setBadgeBackgroundColor({
color: 'red',
tabId: sender.tab.id
});
});
The manifest file needs one additional entry: 清单文件需要另外一个条目:
"background": {
"scripts": ["background.js"]
}
You don't need content scripts for the purpose of detecting page loads. 您不需要内容脚本即可检测页面加载。 A single event listener can be used (in the background page):
可以使用单个事件侦听器(在后台页面中):
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo) {
if (changeInfo.status === 'loading') {
chrome.browserAction.setBadgeBackgroundColor({
color: 'red',
tabId: tabId
});
}
});
Have a close look at the documentation of chrome.browserAction.setBadgeBackgroundColor
. 请仔细
chrome.browserAction.setBadgeBackgroundColor
的文档。 There are also lots of examples using the browserAction API , you should be able to get a working extension yourself by looking at these samples. 还有许多使用browserAction API的示例 ,通过查看这些示例,您应该可以自己获得一个有效的扩展。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.