Как заставить DIV заблюривать картинку на фоне, которая не находится в этом DIV'е?
Код здесь:
<!DOCTYPE html>
<html>
<head>
<title>Site</title>
<link href="style.css" type="text/css" rel="stylesheet">
<meta charset="utf-8">
</head>
<body>
<div class="blur">
<img src="img.png">
</div>
<script>
$('.blur').blurjs({
source: 'body',
radius: 7,
overlay: 'rgba(255,255,255,0.4)'
});
</script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</body>
</html>
body {
margin: 0 auto;
padding: 0 auto;
background-image: url(background.jpg);
}
.blur {
display: block;
width: 400px;
height: 400px;
border-radius: 400px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(68, 68, 68, 0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(68, 68, 68, 0.75);
box-shadow: 0px 0px 5px 0px rgba(68, 68, 68, 0.75);
}