Хм, а что, если у меня IMG с position:fixed, я не могу его по top,left,bottom,right растянуть? А, окей, по left,top,width,height могу.

Что-то я не пойму:
https://stackoverflow.com/questions/3341183/how-can-i-make-page-scrolling-trigger-mouseover-events

1. determine the size and position of every element that should get a mouseover handler.
2. add a scroll listener to the window.
3. In the handler, get the mouse cursor position and pageOffset.

А как мне из window.onscroll=function(event){…} координаты мыши узнать?

В самом событии вроде и pageX и layerX равны нулю.

(У меня просто onmouseenter при прокрутке колёсиком не триггерится).

Есть какие то способы отрендерить независимый DOM? Типо такой блок который никак не будет связан с внешним DOM, пожалуйста не советуйте iframe у него очень сильные проблемы¹ с рендером в хроме которые никак не решаются.

1. См. Blurry iframe

А что значит отрендерить? Что значит "не будет связан с внешним DOM"? Что ты с ним планируешь дальше делать?

Это означает что он будет внутри какого-то документа и никак не зависить от его CSS стилей и JS скриптов, можно сказать "изоляция".
Читал что-то про микро-фронтенд но там нифига не понятно.
Ещё слышал про custom-elements и shadow-dom но это не полноценный DOM, мне нужно иметь свои js скрипты css стили и все такое, т.е #document в #document

Ну судя по требованиям нужны именно iframe. Ну раз они не подходят, то я не знаю альтернативы. А для каких целей планируешь такое использовать? От кого/чего изолируемся?

Могу предложить 1 что пришло в голову) css modules + reset в css)

Бля концепт конечно говно даже рассказывать стыдно, есть grocery_crud, у него скажем есть свой API где он отправляет объекты типо
{
css_files: [//массив с ссылками],
js_files: [//массив с ссылками],
js_config_files: [//массив с ссылками],
inner_html: '//какой то модуль'
}

Теперь надо сделать попап с именем "быстрое меню" и запихнуть сюда дофига кнопок при нажатии которых будет вызываться модули с grocery_crud.

Проблема в том при обычном добавлении эти js файлики конфликтуют с теми которые уже есть на странице, их надо как то пере инициализировать но когда я делаю это то получается жопа, всякие евенты удваюваются и все такое.
Когда пробую iframe то он при показывании этих модулей делает какой то блюр ефект и это зависит от движка хрома, это не фикситься.

Действительно странный концепт. 😂

Я бы к хуям отправил этот проект но мне его надо поддерживать

Теперь я ищу как изолировать мой модуль от всей верстки не используя iframe

При изоляции JS + HTML вроде не должно быть проблем. Просто не используем глобальные переменные, всё внутри одной функции. А вот с CSS не понятно. Может проще добавить какой-нибудь уникальный префикс ко всем своим стилям?

Ещё проблема в том что я не могу вмешиватся в ту вёрстку которая приходит ко мне. И из-за этого я не могу предотвратить проблему с изоляцией js. Например на странице уже есть какой то модуль который связан с flexigrid.js, но в быстром меню есть ещё одно место где я его вызываю, сперва у меня был скрипт который не пропускал те скрипты которые уже есть на странице, а потом я понял когда я делаю так то тогда очень много евентов не накладываются на те модульи которые мне нужны и модуль становится тупо не рабочим, а если заново все это вызывать то тогда евенты дублируется на старых елементах.

Сука ненавижу CRM

Выглядит совсем грустно. 🙈

а чего не попробуешь css modules + reset css?)

а, жс то влезет(

если селектор айдишный будет или по элементу

css через all:unset; попробовать