微件:Spoilerhide
跳转到导航
跳转到搜索
<style>
.template-spoilerhide {
position: relative;
overflow: hidden;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
.template-spoilerhide-content {
filter: blur(8px);
-webkit-filter: blur(8px);
-ms-filter: blur(8px);
pointer-events: none;
}
.template-spoilerhide-dialog {
display: block;
position: absolute;
top: 0;
left: 0;
height: 120px;
width: 100%;
padding-top: 8px;
background: linear-gradient(#E7615C 80%, transparent);
color: white;
text-align: center;
font-size: 20px;
}
.template-spoilerhide-button {
display: block;
width: 160px;
margin: auto;
margin-top: 8px;
border-radius: 4px;
background-color: white;
box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, .12);
transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), background-color 280ms cubic-bezier(0.4, 0, 0.2, 1);
color: #E7615C;
text-align: center;
padding: 4px;
font-size: 20px;
cursor: pointer;
}
.template-spoilerhide-button:hover,
.template-spoilerhide-button:focus {
background-color: #eee;
box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, .12);
}
.template-spoilerhide-button:active {
background-color: #ddd;
box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, .12);
}
</style> <script type="text/javascript">
(window.RLQ = window.RLQ || []).push(["jquery", function () {
$("#spoilerhide-button-").on("click", function() {
$("#spoilerhide-").removeClass("template-spoilerhide");
$("#spoilerhide-content-").removeClass("template-spoilerhide-content");
$("#spoilerhide-dialog-").css("display", "none");
});
}]);
</script>