Почему я не могу показать всплывающее окно на некоторых сайтах?

Question

Я сделал расширение Chrome, и мое расширение будет показывать всплывающее окно на веб-странице. Я создаю всплывающее окно по тегу div следующим образом:

var myPopupDiv = document.createElement('div');
myPopupDiv.className = "popup";
document.body.appendChild(myPopupDiv);

И css для всплывающего класса следующим образом:

div.popup {
color: #fafafa !important;
border-color: #000000 !important;
border-width: 0px !important;
-webkit-border-radius: 10px !important;
background-color: #363636 !important;
font-size: 16px !important;
padding: 8px !important;
overflow: visible !important;
z-index: 999999 !important;
text-align: left  !important;
cursor: default;
position: absolute !important;
}

Я не знаю, почему мое всплывающее окно иногда отображается на некоторых страницах, а иногда не отображается на других. В конкретном случае мое всплывающее окно не может отображаться, когда мое расширение работает на веб-странице stackoverflow.

что не так с моим кодом javascript? Как сделать всплывающее окно на любых веб-страницах?

Спасибо за вашу помощь.

Answer 1

Я только что проверил, и CSS StackOverflow определяет класс popup с display: none. Используйте панель Chrome "Inspect Element", чтобы проверить, добавлен ли ваш div в DOM и применен ли стиль display: none. Я бы исправил это, придумав уникальное имя для вашего класса CSS.