zoukankan      html  css  js  c++  java
  • 将博客园的照片添加放大功能

    看到别人花里胡哨(这里是褒义,哈哈哈)的页面,很心动,然而不想花那个时间去美化,但是查资料看到一篇写的很漂亮的csdn博客时,图片的放大功能起了很关键的作用,有时候我们截图是全屏,但是在博客中插入后容易看不清,这个功能还是很实用的,所以还是想试试。

    参考博客:https://www.cnblogs.com/yadongliang/p/10859206.html#_label2_0

    先看看结果吧,这是随便截的图,试试能不能放大。

     好了,效果展示了,接下来看看怎么实现吧。

    第一步:下载代码包

      链接:https://github.com/lokesh/lightbox2

      

    第二步:上传代码和图片

      1. 打开.lightbox2-devlightbox2-devdistcsslightbox.css

      2. 搜索“background: url”,可以看到四个图片路径,一个后缀是.gif,另外三个是.png。博客园不支持png上传,所以将后缀是.png的都换成.ico。举例:../images/close.png --> ../images/close.ico。

      3. 进入.lightbox2-devlightbox2-devdistimages,将那三张png图片文件的后缀都改成ico

      4. 上传.lightbox2-devlightbox2-devdistimages下的4张图片文件到博客园

      5. 上传.lightbox2-devlightbox2-devdistcsslightbox.css和.lightbox2-devlightbox2-devdistjslightbox-plus-jquery.js文件到博客园

      6. 检查6个文件是否已经上传成功

      

    第三步:编写页脚HTML代码

    好了,现在可以测试一下上传的图片能否单击放大了。

  • 相关阅读:
    DML
    DDL
    SQL的分类
    SQL语句的规范
    sql的演示
    运算符
    导入导出数据
    mysql的数据类型
    python+selenium2自动化---复用已有的浏览器
    python+selenium2自动化---通过js脚本给时间控件赋值
  • 原文地址:https://www.cnblogs.com/smart-zihan/p/12970905.html
Copyright © 2011-2022 走看看