CSS3的position: fixed;带来的闪烁等奇怪问题

前段时间博主发现自己网页中所有CSS属性含position: fixed;都出现了奇怪的问题,这些问题总结如下:

1. 在bootstrap中的modal中,有的时候出现无法输入显示文字的情况。录入光标会卡住,但是文本实际已经录入进去了,只不过UI没反应。

2. 还是上一个modal的问题,弹出modal之后背景会变黑掉这个效果,有的时候会出现部分区域不显示的情况。不是高度或者层被遮挡,而且是一块一块的不显示。

3. fixed的元素在页面滚动时出现时隐时现,元素闪烁的情况。

具体的解决方法是,往所有position: fixed;的元素添加

-webkit-transform: translateZ(0);

如下图恢复正常的效果:
QQ截图20150114125349

这样上面这些奇怪的问题就能解决,经过查阅网上也有资料说这是jquery-1.11.0会造成这种情况而7就不会,博主未加尝试。

Linux自动备份mysql数据库并发送到指定邮箱

首先新建/home/website/backups/目录,并确保安装mutt
vi新建文件,命名为backup.sh,然后输入如下代码

mysqldump -u用户名 -p密码 数据库名 > /home/website/backups/databackup.sql
tar zcf /home/website/backups/databackup.sql.tar.gz /home/website/backups/
echo "内容为数据库备份" | mutt 邮箱地址 -a /home/website/backups/databackup.sql.tar.gz -s "数据库备份"
rm -rf /home/website/backups/*

保存后,给予执行权限

chmod 700 backup.sh

然后编辑计划任务

crontab -e
* */3 * * * /home/website/lenghui.sh

Whatever服务器紧急通知

紧急公告:

由于未知的网站BUG造成以下用户信息丢失

请以下QQ的玩家马上私戳mydansun告知游戏昵称

1727113877

另外请以下三位创造模式截图的玩家,私戳mydansun告知QQ号,哪个图是你的和游戏昵称

549eb5da6cff7 549fb4c055708 549fc68b09320

七牛批量删除空间内的所有文件

最近在使用七牛的免费云存储服务,官方的工具好像并没有提供批量删除的功能,于是根据SDK简单写了一个批量删除的程序。

需要在php环境上使用,网盘传送门http://pan.baidu.com/s/1bntnxgV

配置好delete.php文件的bucket,accessKey和secretKey,运行即可,页面会自动刷新到全部删除完毕(删除过程中最好关闭空间的缓存,要不然会删不完啊喂!)

Debian中apache2查看/启用/禁用模块

如果我们是自己编译的apache,那么启用或禁用某个模块应该说是比较容易的事,只要修改apache的配置文件就可以了。但是我们没有理由不用已经做好的二进制文件进行安装,使用apt-get要方便多了。

但是这样的安装,apache默认会启用一部分模块,一般情况下,它已经满足了大部分的需求。但是我们的需求肯定是不能确定的如我们可能要利用apache实现重定向的功能,我们可能需要alias,rewrite模块。

实际上在apache下有两种类型的模块,一种是事先编译到apache中的,另一种是在你运行apache时载入的模块你可以使用下列命令来检查你的apache已经编译了哪些模块:

apache2 -l

事实上,在apache2的安装目录下,有这样的两个目录:

/etc/apache2/mods-enabled/ 已经被启用的模块

/etc/apache2/mods-available/ 当前系统中可用的模块

你可以使用下列命令来启用或禁用模块:

a2enmod 模块名

a2dismod 模块名

其实它的动作就是在/etc/apache2/mods-enabled/目录创建或删除一个模块对应的链接文件。当然你也可以手工做这个动作了。

Minecraft我的世界prism棱镜插件基本使用说明

鼠标查询:

首先保证自己处于空手情况,输入/prism i即可进入查询状态,鼠标左键查询点击方块历史,鼠标右键查询在当前方块的点击面上是否有方块历史。总之就是左键查现有的,右键查看不见的(比如被拆的)。

Lookup查询(推荐):

使用命令/prism l(或/prism lookup),常用的参数包括下面几个:

a:[action] – 动作,比如 “block-break”,常用的动作列表将在后面列出。

r:[radius] – 你周围多少距离的方块(半径,上天入地的圆柱体)。

r:we – 使用we区域,拿起你的木斧吧亲!

r:player:[radius] – 基于玩家和以该玩家周围指定距离的方块(远程查水表必备)。

r:x,y,z:[radius] – 基于指定坐标周围指定距离的方块。

b:[blockname/id] – 查询指定方块的id,比如b:grassb:2b:2:0

e:[entity] – 生物名,比如pig。

t:[timesince] – 查询多长时间的记录,比如 1s(秒), 20m(分), 1h(小时), 7d(天), 2w(周);比如1h20m(一小时二十分钟).

before:[time] – 查询多长时间之前的记录,时间格式类似t参数。

since:[time] – 查询多长时间之后的记录,时间格式类似t参数。

p:[player] – 查询指定玩家的记录

附录1:常用的动作列表

手懒我就不翻译了,以下来自谷歌娘的翻译,毁三观准备

block-break(块断)

block-burn(块烧伤)

block-fade(块褪色)

block-fall(块坠落)

block-form(块表)

block-place(块的地方)

block-shift(块移)

block-spread(块蔓延)

block-use(块使用)

bucket-fill(斗填写)

bonemeal-use(骨粉使用)

cake-eat(蛋糕吃)

container-access(容器访问)

craft-item(工艺项)

creeper-explode(爬山虎,爆炸)

crop-trample(作物践踏)

dragon-eat(龙吃)

enchant-item(附魔项)

enderman-pickup(末影,皮卡)

enderman-place(末影就地)

entity-break(实体断)

entity-dye(实体染料)

entity-explode(实体爆炸)

entity-follow(实体遵循)

entity-kill(实体杀)

entity-shear(实体剪切)

entity-spawn(实体重生)

fireball(火球)

hangingitem-break(hangingitem断)

hangingitem-place(hangingitem放)

item-drop(项目降)

item-insert(项目插入)

item-pickup(项目 – 皮卡)

item-remove(项目 – 删除)

lava-break(熔岩断)

lava-bucket(熔岩斗)

lava-flow(熔岩流)

lava-ignite(熔岩点燃)

leaf-decay(叶腐烂)

lighter(打火机)

lightning(闪电)

mushroom-grow(蘑菇种植)

player-chat(玩家聊天)

player-command(玩家命令)

player-death(玩家死亡)

player-join(球员加盟)

player-kill(玩家击杀)

player-quit(玩家退出)

player-teleport(玩家瞬移)

potion-splash(药水飞溅)

sheep-eat(羊吃)

sign-change(征变化)

spawnegg-use(spawnegg使用)

tnt-explode(TNT,爆炸)

tnt-prime(TNT贷)

tree-grow(树成长)

vehicle-break(车辆断)

vehicle-enter(车辆进入)

vehicle-exit(车辆退出)

vehicle-place(车辆到位)

water-break(断水)

water-bucket(水水桶)

water-flow(水流)

world-edit(世界编辑)

xp-pickup(XP-皮卡)

UMeditor为粘贴QQ截屏增加等待图片

一直在用百度的UMeditor,但是发现这个编辑器相比同出师门的Ueditor,更新频率差了很多。

在Ueditor中我们粘贴QQ截屏的时候,会先在编辑器中显示一个加载的GIF,如下图显示

QQ截图20141203170612

而在UM中完全没有这个效果,导致在实际部署中用户虽然使用了粘贴功能却不知道是否有文件正在上传。本地测试不容易发现因为上传速度太快了。

所以我们在UM中把这个功能加上即可,定位到umeditor.js,找到拖放文件到编辑区域,自动上传并插入到选区这个注释后面autoupload中的sendAndInsertImage函数

替换成如下代码

var sendAndInsertImage = function (file, editor) {

//创建模拟图片
var loadingId = 'loading_' + (+new Date()).toString(36);
var loadingHtml = '';
editor.execCommand('inserthtml', loadingHtml);

//模拟数据
var fd = new FormData();
fd.append(editor.options.imageFieldName || 'upfile', file, file.name || ('blob.' + file.type.substr('image/'.length)));
fd.append('type', 'ajax');
var xhr = new XMLHttpRequest();
xhr.open("post", me.options.imageUrl, true);
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
xhr.addEventListener('load', function (e) {
    try {
        var json = eval('('+e.target.response+')'),
            link = json.url,
            picLink = me.options.imagePath + link;
       /* editor.execCommand('insertimage', {
            src: picLink,
            _src: picLink
        });*/
        var loader = me.document.getElementById(loadingId);
        if (loader) {
            loader.setAttribute('src', picLink);
            loader.setAttribute('_src', picLink);
            loader.removeAttribute('id');
         }
    } catch (er) {
    }
});
xhr.send(fd);
};

另外别忘了在themes\default\images文件夹下面放一个loading.gif,另存为下面这个就是了。
loading

再次测试,就可以看到效果了

QQ截图20141203171400