Как реализовать blur эффект фона div элемента, чтобы он подстраивался под background body.
Вот пример
Ответ
Есть не суперкроссбраузерная, но рабочая штука, css-свойство filter
div {
background: url(http://lorempixel.com/800/800/people/3/);
width: 800px;
height: 800px;
position: relative;
}
div> div {
position: absolute;
width: 200px;
height: 200px;
overflow: hidden;
background: transparent;
background: url(http://lorempixel.com/800/800/people/3/) -300px 500px;
left: 300px;
top: 300px;
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
}
Подробнее здесь - https://webref.ru/css/filter Ну и спецификации - http://www.w3schools.com/cssref/css3_pr_filter.asp
Комментариев нет:
Отправить комментарий