-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
26 lines (26 loc) · 775 Bytes
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html>
<html>
<head>
<title>Blurred Circle Border</title>
<link href="style.css" rel="stylesheet" type="text/css">
<script type="application/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
<div class="blurredbg">
<div class="img"></div>
<div class="overlay"></div>
<img src="https://www.w3schools.com/w3images/avatar2.png" id="avatar" height="500px" width="500px" class="image"/>
</div>
<script>
$(document).ready(function() {
var bgimage = $('#avatar').attr('src');
$('.blurredbg .img').css({
"background-image": "url('" + bgimage + "')",
"background-repeat": "no-repeat",
"background-size": "cover",
"background-position": "center center"
});
});
</script>
</body>
</html>