博客图片点击放大
1. 进入博客,点击管理——》设置——》申请支持JS代码权限;
2. 支持JS代码后,在页脚Html代码中粘贴如下代码:
<div id="shadediv" style="display: none;position: fixed;z-index: 1000;top: 0;left: 0; width: 100%;height: 100%;background-color: rgba(255,255,255,.8);"> <img id="bigimg" style="border: 0;position: absolute;left: 50%;top: 50%; transform: translate(-50%,-50%); src="" /> </div>
<script type="text/javascript"> $("img").mouseover(function(){ $(this).css("cursor","pointer"); }); $("img").click(function(){ var src = $(this).attr("src"); $('#shadediv').fadeIn(); $('#bigimg').attr("src", src); $("#bigimg").mouseover(function(){ $(this).css("cursor","pointer"); }); $('#shadediv').click(function(){ $(this).fadeOut(); }); }); </script>