Question

我正在尝试使用Chrome扩展程序来淡入淡出整个页面。

我从示例中开始将背景变为红色，并尝试将fadeOut函数添加到正文中，但该部分不起作用 - 只有转动的红色部分才有效。

// Called when the user clicks on the browser action.
chrome.browserAction.onClicked.addListener(function(tab) {
  // No tabs or host permissions needed!
  console.log('Turning ' + tab.url + ' red!');
  chrome.tabs.executeScript({
  code: 'document.body.style.backgroundColor="red"; document.body.fadeOut();'
  });
});

有什么想法吗？另外，我试图弄清楚document.body和$（'body'）之间的区别。我是javascript的新手，似乎当我搜索解决方案（即“如何在javascript中淡化整个页面”）时，他们使用$（'body'），而chrome扩展代码使用document.body。我不确定它们是否兼容。谢谢！

Answer 1

由于您只使用Chrome，因此无需使用jQuery即可完成此操作。

更改代码行以运行：

document.body.style.backgroundColor="red"; 
document.body.style.transition = "opacity 1s ease-in-out";
document.body.style.opacity = 0;

您可以在开发工具的控制台窗口中尝试此操作。

Answer 2

请尝试$(document.body).fadeOut();。顺便说一下，在运行fadeOut（）之前，必须在Content Script中包含jQuery。

使用Chrome扩展程序淡出整个页面

2 个答案: