jQuery给GIF动画添加缩略图,不止用在WordPress

jQuery让GIF图片默认为静态图片,鼠标经过时显示动态,不仅仅在WordPress,基本所有网页上GIF图片默认是显示动态的,这样如果多了,就会让网页很卡,也会消耗资源的,所以我研究了一下怎么让GIF像视频一样,显示个缩略图,等鼠标经过或者点击播放的时候播放动态图片。 首先我们来屡一下思路: 1、假设GIF图片像视频一样都是由帧组成的,我们获取其中一帧来做缩略图,嗯,在CSS3时代我们可以用c......继续阅读

带有进度环的返回顶部效果

大致原理就是根据滚动距离和文档高度排定滚动百分比然后绘制画布,百分比数字是用data储存并使用css的 content属性实现。 确保引入了jquery,下面的代码加入到你的js文件中 [js] var bigfa_scroll = { drawCircle: function(id, percentage, color) { var width = jQuery(id).width(); var......继续阅读

轻量级的WordPress图箱插件lightbox2

算不算轻量级的呢?我也不知道,但js代码只有20kb不到,应该算吧! 言归正传,演示见本站的图片吧 作者插件地址:https://lokeshdhakar.com/projects/lightbox2/ 主要是作者不断的更新,一直保持着插件适应最新的jquery库,所以我觉得很值得推荐。 首先看下html代码结构: [xml] <a href="images/image-1.jpg......继续阅读
HTML5 Canvas流动线条动画特效

HTML5 Canvas流动线条动画特效

先看下演示: [caption id="attachment_1281" align="alignnone" width="1175"] HTML5 Canvas流动线条动画特效[/caption] 或者看看liuyuanlin.com的顶部背景,可以借鉴一下。 怎么样?很好看把?可以用他在做背景等特效。 首先看下html结构代码: [xml] <!DOCTYPE html> <......继续阅读

WordPress Ajax 评论分页+翻页代码

WordPress 升级到4.4版本后源代码分页函数失效。只需要给paginate_comments_links函数加上个total参数就可以了。代码已更新。 如果某篇文章评论特别多的时候,我们可以启用分页,但是想查看其他分页的评论就要刷新页面,但是文章内容是相同的,所以这个动作用AJAX 来完成用户体验会好一些。 wp_list_comments有一个callback参数,这个参数是评论回调函数......继续阅读

WordPress Ajax Comments 代码版

没想到这么多年了,这个插件终于有人更新了,其实在几年前就更新了,我也是最近才发现,所以整理了一下: 下载源代码:链接: https://pan.baidu.com/s/1FPbwwYAFdxnoKldefURv4g 提取码: 674u 或者 下载作者地址 注意是把解压得到的文件夹放到主题目录下,不是文件夹中的文件。 然后在functions.php中使用如下代码调用 [php]require ge......继续阅读