【log】snsTest,继续完善测试项目功能

表情功能smohan

刚做完表情功能，用了smohan JQuery插件 | link

debug时善用浏览器，首先就是路径问题，"/images/"和"imgages/"差距应该就是前者会在根目录下寻找而后者直接在当前目录下寻找子文件夹。

然后JQuery升级，原来smohan.js文件里的live（）方法和die（）方法都不能用了，全部换成on（）和对应的off（）.

这点官方doc里有详细说明（JQuery.com）

然后显示界面用替换字符来显示图片，并不能用Laravel的语法，因为输出的时候会显示出替换前的，所以老实：

<?php
    $strcon = htmlspecialchars($mes->content);
    $strcon = str_replace(htmlspecialchars("<emt>"),"<img src='/images/face/",$strcon);
    $strcon = str_replace(htmlspecialchars("</emt>"),".gif'>",$strcon);
    echo $strcon;
?>

改变时间格式：eg.3小时前发布

link

新建一个timeFormat方法，传入时间，然后转换为秒数，

$t=time()-strtotime($time);

然后就计算判断时分秒了：

switch ($t){  
            case $t<60:return $t.'秒前';break;  
            case $t>=60 && $t<3600:return floor($t/60).'分钟前';break;  
            case $t>=3600 && $t<86400:return floor($t/3600).'小时前';break;  
            case $t>=86400 && $t<604800:return floor($t/86400).'天前';break;  
            case $t>=604800 && $t<2419200:return floor($t/604800).'周前';break;  
            case $t>=2419200 && $t<29030400:return floor($t/2419200).'月前';break;  
            case $t>=29030400:return floor($t/29030400).'年前';break;  
            default:return '刚刚';  
        }

感觉还是满精妙的。

CSS水平居中垂直居中

永恒的烦恼，终于找到一篇写的很好的文章：link

第二种方法是用transform解决的，是css3的属性应该，挺感兴趣。

其实也只有这种方法成功了，wrap了太多，不知道哪儿width、position、float这些都有可能引起margin：auto失败吧。

.element {
    width: 600px; height: 400px;
    position: absolute; left: 50%; top: 50%;
    transform: translate(-50%, -50%);    /* 50%为自身尺寸的一半 */}

还有关于table的tips：想要固定某<td>（列宽）的宽度，可以把其他<tr>的宽度设定就好，注意是百分比。

css背景图片自适应

挺管用，就是不知道兼容性怎么样。

	background-size:100% 100%;