HighSlide是一款经典的原生js灯箱效果库,支持图片、flash、html及ajax页面内容的弹出和拖拽浏览,其API功能丰富且平台兼容性稳定,问世多年来在全球网站前端应用十分广泛。

它的插件也是我比较早就为typecho写的,主要用于实现博客的链接弹窗与相册效果,也曾参考wordpress的插件为Smilies提供过特效支持。后来页面相册部分升级为独立的上传与数据库配置,从列表录入到分组输出更为便捷自如,再加上附件截取缩略图功能的无缝集成和云储存API支持等,也算是blog程序中发挥HS效能相当全面的一件了。

基本功用还是将目标地址为图片的链接实现点击弹窗。像这样的源码(Markdown链接同理):

文字链接

插件启用后会自动套用效果,如»

新版支持编辑文章时在附件选项卡下点击缩略图模式按钮预览图片并进行裁切。该模式不会显示非图片附件,拖选区域后即可通过下方图标确认截取并插入图片链接,再次点击按钮可返回普通模式进行附件的编辑或删除操作。1.4.7后缩略图也会归档至文章附件里,和原图一起方便查找和管理。之前版本生成的附件缩略图不支持预览,但可以通过重新截取将其替换并归档。

如果在插件设置的弹窗模式中勾选“所有图片”则无链接图片也会实现原图弹窗。应用范围设置能让你灵活地选择加载效果的页面类型。其他选项就不细说了,背景遮罩和角标文字支持留空,注意分界线下方部分只对全功能版核心有效。

接下来是另一个重点功能:页面相册。首先插件启用后会在数据库新增一行typecho_gallery并在管理菜单内添加独立面板入口如下:

通过面板右上方的预览区域可以方便地进行图片上传与缩略图截取操作,然后填写各项信息录入左侧列表。其中图片名称用于后台标识,描述则可以在前台显示。录入完毕后即可在页面内容里写入[GALLERY-相册组数字]发布显示。默认每个相册组第一张图片为封面,可通过拖拽调整排序。多个相册支持[GALLERY-数字,数字,...](半角逗号隔开)形式联合输出,方便横排显示和加速解析。

右侧顶部的相册设置选项卡下可选择8套风格并进行缩略图尺寸设置。新版集成了有免费额度的4家云储存sdk,支持按API直接生成云端缩略图。同时云储存选项底部也可勾选应用到文章附件缩略。

最后一项功能便是html弹窗标签的解析。简单说用该标签括住的内容即会出现在弹窗内,而触发弹窗的链接文字可以通过写入text参数指定。若文章内有多个html弹窗需指定id参数(只有一个可不写),插件设置里勾选html弹窗下的“标题栏”后还可用title参数指定标题文字,width和height参数用于指定弹窗大小(单位px可不带)。附上一个完整实例:

id="pop1" text="点我看MM" title="窗中窗效果演示" width="500" height="310">

点击下图换MM

以上代码效果如» (标签内使用Markdown语法内容同理)

特别提到的是ajax参数,它可以异步调取指定页面内容到弹窗内(必须为同域名下或开启跨域许可的页面),并支持接#元素id显示锚点区域。这里以本站友情链接页面的评论区为例:

text="点我看演示" ajax="http://www.yzmb.me/links.html#comments" title="“LINK有情”页面评论区" height="600">

ajax模式调用目标页面做弹窗内容,故此处文字不会显示。

启用插件(全功能版)后效果如»

点我看演示

ajax模式调用目标页面做弹窗内容,故此处文字不会显示。

1.4.7版还针对typecho1.1做了一些重写优化,包括异步截图的反馈效果,GD库生成的图像画质及数据库的调用逻辑等等,在稳定性和效率方面有更好的表现。主要更新记录都列在下方的changlog里。也在此致谢插件编写过程中参考的所有开源作品。欢迎大家下载试用并提出宝贵的意见建议!:)

HighSlide_v1.4.7.zip (250.7 KB, 下载次数: 7523, 最后修改: 2018-07-16 17:26)

Changlog

1.4.7

使用5.0.0packed双内核;

附件栏内集成缩略图模式;

附件缩略图支持归档联动;

优化相册的修改模式机制;

支持4家免费云储存及API;

增加html弹窗编辑器按钮;

修正MD转义等bug。

1.4.6

可预览附件截取缩略图;

相册列表实现异步加载;

相册标签可无参数解析;

相册可自定义上传目录;

相册集成3家云储存sdk;

增加角标显示方位设置;

增加缩略图多规格设置;

修正ajax参数兼容bug;

优化代码结构添加注释。

1.4.5

可手动拖拽截取缩略图;

增加自动翻页效果设置;

相册面板支持组别切换;

相册标签支持联合解析;

相册使用独立上传目录;

修正相册皮肤效果bug。

1.4.4

增加替换应用范围选择;

相册图片上传自动归档;

修正若干判断和样式bug。

1.4.3

兼容旧版附件链接替换;

修正角标默认链接地址;

1.4.2

增加角标文字自定义设置;

增加无链接图片替换模式;

增加hs标签ajax参数支持。

1.4.1

修正换行链接替换bug;

修正Markdown兼容问题。

1.4.0

使用4.1.13packed双内核;

代码重写兼容typecho0.9;

增加相册数据库及面板支持;

增加html弹窗标签参数解析。

1.3.0

使用4.1.9full-packed内核;

优化表情弹窗效果并兼容IE6;

增加页面相册功能和皮肤选择。

1.2.0

使用4.0.8full-min内核;

解析摘要并增加模版判断。

1.1.0

使用4.0.5html-packed内核;

为Smilies提供表情弹窗支持。

1.0.0

使用HighSlide3.3.18内核;

实现文章图片链接弹窗效果。

(Last modified: 2018-07-16 22:04)

typecho图片插件_Typecho弹窗相册插件HighSlide1.4.7更新相关推荐

  1. typecho图片水印插件

    注意 插件目录必须为 waterMark,不然会无法启用. 如果使用后无法上传图片,请检查是否安装 php-gd 更新 2021-9-27 取消了对 typecho 版本的要求 增加了 2x 水印的支 ...

  2. 20款最好用的wordpress图片相册插件

    用插件把你的图片相册打扮的更加漂亮,更加容易自己管理,也更加利于访客的浏览.本文里面,帕兰为你收集了21款WordPress图片相册插件.让我们先来看一下Wordpress的图片相册类插件的几个大类: ...

  3. NextGEN Gallery ~ 最强WordPress相册插件

    博客照片很多?上传和管理图片太烦?想幻灯显示相册?在博客中任意插入动态图片效果?-- 你和我一样,需要NextGEN Gallery,最强WordPress相册插件! 其实网上可以搜到不少关于这个插件 ...

  4. Process插件:typecho加载页面进度条插件

    介绍: typecho加载页面进度条插件 这是一款适用于typecho任何主题的加载页面进度条,可以让你的博客加载时显得更加顺滑而不会显得过于突兀,使用本插件可以很好得起到视觉缓冲的作用. 本插件有十 ...

  5. 8个超炫酷的jQuery相册插件欣赏

    在网页中,相册应用十分常见,如果你经常逛一些社交网站,那么你应该会注意到很多各式各样的网页相册应用.今天我们要来分享一些最新收集的jQuery相册插件,这些精美的jQuery相册插件可以帮助你快速搭建 ...

  6. SlidesJS基本使用方法和官方文档解释 【Jquery幻灯片插件 Jquery相册插件】

    SlidesJS基本使用方法和官方文档解释 [Jquery幻灯片插件 Jquery相册插件] 标签: jquery文档functionstringdiv相册 2012-04-19 15:23 3931 ...

  7. uniapp框架如何实现仿微信相册插件 | 图视频编辑 + 压缩

    在上上篇文章中(),我们基于uniapp框架实现了仿微信相册中的拍照+录像功能.今天,就继续在uni-app中实现: 1: 图片编辑 2: 视频编辑 3: 文件压缩 技术实现 开发环境:Hbuilde ...

  8. php相册管理插件,相册插件-ZBLOGPHP插件-鸟儿网络

    应用信息 名称: 相册插件 售价: 68元 应用ID: Nobird_Photo 最低要求: Z-BlogPHP 1.5 Zero Build 151626 版 本: 8.01 发布日期: 2013- ...

  9. Emlog漏洞————Emlog相册插件前台SQL注入+Getshell

    Emlog简介 Emlog是"Every Memory Log"的简介,意即:点滴记忆.它是一款基于PHP语言哈MYSQL数据库的开源.免费.功能强大的个人或多人联合撰写的博客系统 ...

  10. jQuery相册插件(开源下载)

    一,导言 上次 "不定义JQuery插件,不要说会JQuery" 的博客写的肤浅,漏洞百出,而且最重要的是从理论上说如何定义一个jQuery插件,没有实质性的写一个jQuery插件 ...

最新文章

  1. RuntimeError: each element in list of batch should be of equal size
  2. spring cloud Alibaba 的 Nacos学习笔记
  3. Thrall’s Dream HRBUST - 2048【BFS or 强连通分量】
  4. matlab 由图片生成视频
  5. bytevalue_Java Short类byteValue()方法及示例
  6. 使用线程池应该注意的问题
  7. hdu 1186(搜索+HASH)
  8. ssh之雇员管理系统(7)-spring可以启用注解的方式来配置属性+解决懒加载问题...
  9. 毕设题目:Matlab语音去噪
  10. 解决 Win11 开机ctfmon.exe不能自启
  11. 通过java实现word转PDF
  12. 【iOS逆向与安全】frida-trace入门
  13. python表示整数的点称为整点_礼行天下 仪动职场智慧树网课答案
  14. HTML5手机页面触屏滑动上下翻页特效
  15. 运维是不是IT行业里技术含量最低的岗位?
  16. 第六周组会摘要工作计划与分工
  17. Junos SRX NAT介绍
  18. 最新哔哩哔哩视频弹幕播放器源码+带后台/亲测无错误
  19. 第五届蓝桥杯真题解析【JavaC组】
  20. ERROR: CIB not supported: validator 'transitional-0.6', release '3.0.1'

热门文章

  1. 什么样的固定资产管理系统才能满足企业需求
  2. Teamviewer远程,应用界面显示空白
  3. 使用jwplayer插件播放视频
  4. con 元器件符号_altium designer常用元件电气符号和封装形式
  5. html5网页及Cocos中生成二维码
  6. 用学生邮箱申请Jetbrains教育版账号教程(广中医为例)
  7. 分享一个更高效的数据清理方法,建议收藏
  8. 怎样用计算机10,win10计算器怎么用_win10如何打开计算器
  9. (二)【矩阵论】(线性表示及基与坐标)线性表示|基与维数|向量的坐标|过渡矩阵
  10. recv函数linux,linux 下调用recv函数,死循环在recv函数里面,什么原因?