CSS固定定位實現右下角可關閉廣告
阿新 • • 發佈：2018-11-13
程式碼:
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.adv {
position: fixed;
right: 10px;
bottom: -20px;
opacity: 0.8;
}
.close {
position: relative;
top: -315px;
right: 50px;
background-color: transparent;
border: none;
font-size: 20px;
cursor: pointer;
}
</style>
</head>
<body>
<div class="adv">
<img src="qq.png" alt="connect">
<button class="close">×</button>
</div>
<script>
var close = document.getElementsByClassName('close')[0]
close.onclick = function () {
document.getElementsByTagName('img')[0].style.display = "none";
close.style.display = "none";
}
</script>
</body>
</html>
廣告圖:
效果圖:
