Странности эффекта BLUR в браузерах
Захотелось мне сделать а всплывающего лайтбокса эффект матового стекла.Первым делом гугл выдал мне ссылку на сайт: https://developer.mozilla.org
ну захожу беру код оттуда. Все просто : строка CSS {backdrop-filter: blur(8px);} и всё :)
но листаю ниже и :
как так?
возможно у меня FireFox старый? :
да нет, тут все норм
ЧТО НЕ ТАК ТО??
ведь код с мозиллы :
![firefox,браузеры,chrome,программирование,geek,Прикольные гаджеты. Научный, инженерный и айтишный юмор,приколы для программистов,css,html 0 А https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter,firefox,браузеры,chrome,программирование,geek,Прикольные гаджеты. Научный, инженерный и айтишный юмор,приколы для программистов,css,html](http://img0.reactor.cc/pics/post/firefox-%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D1%8B-chrome-%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-6715302.png)
![firefox,браузеры,chrome,программирование,geek,Прикольные гаджеты. Научный, инженерный и айтишный юмор,приколы для программистов,css,html О Мо/Ла Ричг1ох
Р1гей>х Browser
'У Уст^ювп^в последняя версия НеАох
88.0.1 (6+€ит***) Что нового
Саааадйу&а
^тср^т ОСТАВАЛСЯ ОТКРЫТЬ*. публична и доступ*»* для осе» И КАЖДОГО.
Хотите попу+>? Слегайте по*ертвос<з*«е или присоединяйтесь»
ПРДМ ПМЫИ«!ОТ1
ПИКНМЯММТЯИДМ
* тпгяш Р*ч*о* ■•.-я^тс*](http://img1.reactor.cc/pics/post/firefox-%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D1%8B-chrome-%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-6715303.png)
![firefox,браузеры,chrome,программирование,geek,Прикольные гаджеты. Научный, инженерный и айтишный юмор,приколы для программистов,css,html Firefox Browser
-У Установлена последняя версия Firefox 88.0.1 (64-6итный) Что нового,firefox,браузеры,chrome,программирование,geek,Прикольные гаджеты. Научный, инженерный и айтишный юмор,приколы для программистов,css,html](http://img0.reactor.cc/pics/post/firefox-%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D0%B5%D1%80%D1%8B-chrome-%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-6715304.png)
Подробнее
xo^0J!jB||!ZOW эшсичэ
0 А https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter
О Мо/Ла Ричг1ох Р1гей>х Browser 'У Уст^ювп^в последняя версия НеАох 88.0.1 (6+€ит***) Что нового Саааадйу&а ^тср^т ОСТАВАЛСЯ ОТКРЫТЬ*. публична и доступ*»* для осе» И КАЖДОГО. Хотите попу+>? Слегайте по*ертвос<з*«е или присоединяйтесь» ПРДМ ПМЫИ«!ОТ1 ПИКНМЯММТЯИДМ * тпгяш Р*ч*о* ■•.-я^тс* * :«>:•
Firefox Browser -У Установлена последняя версия Firefox 88.0.1 (64-6итный) Что нового
firefox,браузеры,chrome,программирование,geek,Прикольные гаджеты. Научный, инженерный и айтишный юмор,приколы для программистов,css,html
Еще на тему
это блурит сам объект - т.е. тот самый DIV который с инфой у меня поверх появляется.
А мне надо блурить то чо позади! А там динамичный CANVAS!
но там же : https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter
указана 70 версия
а у меня:
Для старых браузеров и фаерфокса блюр делают на основе дубля картинки, но это канает если у тебя четкое позиционирование, а если динамика и прыгает туда сюда, то ну его нафик, убери стекло и не еби себе мозг ))
т.е. SWF flash переделанный через AdobeAnimate под Canvas2D
Но наверное придется :(
https://codepen.io/GreggOD/pen/xLbboZ
В Хроме у меня коряво WebGL работает, а FF лучше. С блюром так и не решил :(
мысли есть...
Заходишь на сайт а там Alert("Включите эту хуйню в настройке...")
Так??
в мобильных браузерах backgroundSize: cover коряво работает ли вообще никак :(
при этом с Блюром всё ОК :)
...была одна головная боль, теперь 2