支持跟随鼠标方向的Canvas 3D粒子波浪动画效果代码
偶尔会用到的3D效果，由粒子构成的波浪形状，并以波浪形态运动的3D动画效果，支持鼠标摆动方向。
该效果基于JavaScript 3D库three.js，一个易于使用、轻量级、跨浏览器、通用的3D库。three.js库地址：https://github.com/mrdoob/three.js
HTML代码：
<div id="particle"></div>
引...
jquery鼠标悬浮元素时图片向上滚动的代码
图片高度超过DOM元素节点高度，且父元素添加了overflow:hidden;图片超过高度的部分不会显示，通过鼠标悬浮图片，图片向上滚动的方式显示被截取的部分。
HTML代码：
<div class="scroll">
<img src="图片URL地址" alt="长图片"/>
</div>
CSS代码：
.scroll {padding-bottom:5...
简易HTML5 video点击元素弹框播放视频的jQuery代码
很简单的点击指定元素弹出层播放video视频的代码，如果不喜欢很炫酷的弹框视频效果可以一用。
CSS代码：
.popup{position:fixed;left:0;top:0;width:100%;height:100%;overflow-y:auto;background-color:rgba(0,0,0,0.75);z-index:10;-webkit-overflow-scrolling:touch;di...
TrueNAS Scale系统之DIY配置NAS家用存储服务器（一）：选择硬件
今年早前偶然间了解到NAS存储，就诞生了组装台NAS家用存储服务器的想法，当然也有想过直接购买品牌厂家的成品NAS，了解过群晖nas等其它的品牌，也浏览了不少DIY NAS的文章，最后经过综合考虑，还是决定自己动手DIY NAS。阅读过一些DIY NAS的教程文章后，决定使用开源NAS系统TrueNAS Scale，然后便开始选择硬件。
TrueNAS Scale官方提供的硬件最低要求：双核64位CPU、8GB RAM...
jQuery/Zepto 3D透视圆形/椭圆形旋转木马轮播插件cloud9carousel
cloud9carousel是一款与jQuery和Zepto配合使用、支持多个轮播实例、支持任何HTML元素、速度流畅、专注于性能的3D透视旋转木马插件，使用requestAnimationFrame方法固定FPS来实现平滑过渡动画、自动开启GPU来支持CSS 转换动画（自动判断是否支持），有onLoaded、onRendered、onAnimationFinished三个回调函数，支持元素倒影（需要reflection.js插件...
ECharts柱状图barGap、barCategoryGap、barWidth属性同时设置不生效的原因
barGap用于设置不同系列的柱间距离，barCategoryGap用于设置同一系列的柱间距离，barWidth属性用于设置柱条的宽度，但把几个属性设置之后（如下代码设置），发现设置的值并没有生效。
series: [
{
name: "类型",
type: "bar",
barGap: "30%",
barCategoryGap:'54%',
barWidth: "28",
},
]...
通过axisLabel属性设置Echarts横纵坐标轴核度名称的文字样式
Echarts官方文档给出的设置坐标轴名称文字样式的属性是nameTextStyle，但在yAxis标签中配置后并不生效，这是因为把坐标轴的name标签和axisLabel标签混淆了，nameTextStyle属性设置的是坐标轴的名称标签name，而要修改坐标轴核度data[]的文字样式，要使用的是坐标轴刻度标签axisLabel，两者虽然标签有不少相同的属性，但实际设置的东西是不一样的。
坐标轴名称...
Echarts柱状图barGap参数设置柱间距离不生效的问题
series-bar.barGap是series标签的一个参数，用于配置不同系列的柱与柱之间的柱间距离（数值为柱子宽度的百分比）。配置起来很简单的一个参数，但是会发现直接添加到series标签后不生效，原因是没有把grid标签的top、left、bottom、right四个参数设置完，缺少一个都会导致barGap的配置不生效。
不生效的代码：
var option = {
grid: {
left: "...
Echarts给图形上的label标签数值添加单位或其它文本内容
Echarts图形上的文本标签label标签默认只显示数值，如果想显示更多的文本或者调整样式，可以通过配置label标签参数实现。如给图形的数值增加一个单位字符串。
给数值增加其它文本内容要用到的label标签参数是formatter（标签内容格式器），示例如下：
原代码：
series: [
{
name: 'Direct',
type: 'bar',
stack: 't...
阿里云服务器手动添加安全组解决公网IP无法访问的问题
新买的阿里云ECS使用公网IP和绑定域名都无法访问，提示“连接超时，服务器响应时间过长”。这是因为阿里云服务器内置了安全组功能（安全组是一种虚拟防火墙），安全组的默认设置比较严格，会阻止外部网络访问，解决的方法是添加允许外部网络（公网IP）访问的安全组规则。
操作步骤：
1、登录阿里云网站，进入要设置的实例：
2、在安全组规则页面的【入方向】，点击“手动添加”：
3、设置对应的参数：
授权策略：允许...
lnmp关闭mysql日志功能以及删除自动生成的mysql-bin.xxxx日志文件
访问网站发现异常，phpmyadmin无法访问，并提示“write failed: No space left on device”，前几天刚删除access_log文件以及禁用了日志，20G的磁盘空间还提示服务器的剩余空间不足很奇怪，于是通过df -hl和du -h命令检查出是mysql下的var目录高达14G，检查发现是MySQL日志占据了大量的空间，找到问题，解决方法也很简单，删除生成的日志文件并关闭mysql日志生成。关闭mys...
jquery左右拖拽对比前后效果图片的代码
新旧两张图片效果的不同对比，实现效果通过拖拽按钮对比相同位置的差异。
HTML代码：
<div class="compare">
<div class="pic before" style="background-image:url(before.jpg);"></div>
<div class="pic after" style="backgro...
