hexo-theme-quiet/layout/_partial/post_centent.ejs

42 lines
1.6 KiB
Plaintext

<div class="article-content">
<div id="article" class="content">
<%- page.content %>
</div>
</div>
<style>
@media screen and(min-width:600px) {
.noneimg {
cursor: pointer;
display: none;
z-index: 109;
width: 600px;
height: auto;
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto
}
}
@media screen and(max-width:600px) {
.noneimg {
cursor: pointer;
display: none;
z-index: 109;
width: 88%;
height: auto;
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto
}
}
</style>
<script>
$(function () { $('body').click(function (e) { if ($('.noneimg').length !== 0 && $('.nonediv').length !== 0) { $(".noneimg").fadeOut("slow"); $(".nonediv").fadeOut("slow"); setTimeout(function () { $('.noneimg').remove(); $('.nonediv').remove() }, 800) } else { if (e.target.tagName == "IMG") { let imgUrl = "<img class='noneimg' style='border-radius: <%=theme.picture.imgRadius %>;' src='" + e.target.currentSrc + "'>"; let MDiv = "<div class='nonediv' style='cursor: pointer;display: none; position: fixed;left: 0;top: 0; right: 0;bottom: 0;background-color: <%= theme.picture.colour %>;opacity:<%= theme.picture.opacity %>;z-index: 108;'></div>"; $('body').append(MDiv); $('body').append(imgUrl); $(".noneimg").fadeIn("slow"); $(".nonediv").fadeIn("slow") } } }); $('.article-content').addClass('content-move') });
</script>