博客图片点击放大

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>

  

原文地址:https://www.cnblogs.com/angrybb/p/8529877.html

时间: 2024-10-04 08:03:18

博客图片点击放大的相关文章

图片点击放大

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px Menlo; color: #1d9421 } p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC"; color: #1d9421 } p.p3 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px Menlo; min-height: 21.0px } p.

SmoothImageDemo图片点击放大特效

SmoothImageDemo图片点击放大特效 图片点击有缩放动画效果,从图片本身的位置放大,缩小到图片的位置,不会截动态图... 下载地址:http://www.devstore.cn/code/info/646.html 运行截图:  

js图片点击放大特效代码

原文:js图片点击放大特效代码 源代码下载:http://www.zuidaima.com/share/1550463485676544.htm 图片放大js代码实现,运行效果如下:

Python 实用爬虫-04-使用 BeautifulSoup 去水印下载 CSDN 博客图片

Python 实用爬虫-04-使用 BeautifulSoup 去水印下载 CSDN 博客图片 其实没太大用,就是方便一些,因为现在各个平台之间的图片都不能共享,比如说在 CSDN 不能用简书的图片,在博客园不能用 CSDN 的图片. 当前想到的方案就是:先把 CSDN 上的图片都下载下来,再手动更新吧. 所以简单写了一个爬虫用来下载 CSDN 平台上的图片,用于在其他平台上更新图片时用 更多内容,请看代码注释 效果演示 Python 源代码 提示: 需要先下载 BeautifulSoup 哦,

图片点击放大插件

最近因为需要找了个图片点击放大的插件,感觉还行吧~~ 底下给香瓜文件下载参考↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 如图: 接下来放香瓜代码: 主要用到下面的样式文件和js文件<link rel="stylesheet" href="css/viewer.min.css" /> <script type="text/javascript" src="js/viewer.min.js"

异想家博客图片批量压缩程序

为了方便给自己的博客配图,用Golang写了一个脚本处理,现分享出来,有需要的朋友也可以参考修改使用. 压缩规则 1.图片都等比例压缩,不破坏长宽比. 2.如果是横屏图片,压缩到宽度为1280,高度适应. 3.如果是竖屏图片,压缩到高度为1000,宽度适应. 4.如果分辨率小于这个,不压缩. 5.支持png.jpg.jpeg. 使用方法 go build jfzBlogPicCompress.go 原图放在当前目录下的raw目录中,压缩后的图片生成在thumb目录下,运行生成的二进制文件即可,压

图片点击放大功能

<img src="xxx.jpg" /><script> var flag = true,//状态true为正常的状态,false为放大的状态 imgH,//图片的高度 imgW,//图片的宽度 img = document.getElementsByTagName('img')[0];//图片元素 img.onclick = function(){ //图片点击事件 imgH = img.height; //获取图片的高度 imgW = img.width;

iOS 图片点击放大, 再次点击缩小

XWScanImage  是一个自定义的类, 评论留Q 发 ImageView = [[UIImageView alloc]init]; ImageView.backgroundColor = SetColor(160, 160, 160); //为UIImageView1添加点击事件 UITapGestureRecognizer *tapGestureRecognizer1 = [[UITapGestureRecognizer alloc] initWithTarget:self action

图片点击放大效果

<title>点击放大图片</title><!--方法一--> <img src="/jscss/demoimg/wall.jpg" onclick="this.width+=50;this.height+=50"> <!--方法二--> <img src="/jscss/demoimg/wall.jpg" onclick="this.style.zoom='2'&quo