博主上周接了一个小单子，是关于微信卡券，博主原来主要精力和工作内容属于前端开发，后来学习了Python后发现自己居然也会写后端了，于是一发不可收拾，自学Django和Flask之后发现还是写后端比较有意思，业余时间也接一些小的外包单子挣点零花。外包项目多数是跟微信相关，但是关于微信卡券，博主还真是第一次开发，遇到的坑不少，做此记录，也给初学Python web的萌新一些入门知识。

» 阅读全文

对接第三方app的时候发现内嵌网页里面的背景图死活出不来，但是在同一个手机上的微信自带浏览器确是正常的，通过各种尝试终于发现问题，记录一下。

» 阅读全文

ajax作为一门重量级的技术，在前端交互体验上是非常重要的，但是文件上的上传始终没法做到ajax那种无刷新上传。

暂且不谈HTML5的特性，也不用Flash这种即将退出历史舞台的东西，要实现页面的无刷新上传还是有一些难度的，但是项目必须要这么做的时候，就得想办法搞定了。

仔细研究一番原理后开始写了，这东西13年时候写的，躺在我硬盘角落快3年了，做个笔记，偶尔也会用到。

» 阅读全文

前端开发中js的熟练程度直接影响了页面开发的进度，对js中各种方法属性的熟练掌握当然是必要的功课，比如对数组的操作。

在Python或者PHP中，操作数组是非常方便的，写习惯了Python，忽然切换到js中突然忘记了数组的操作方法，悲催...

找了下资料，整理的不错，转载过来做下记录...

转载自：http://blog.sina.com.cn/s/blog_60e74b5d01017og5.html

» 阅读全文

function MillisecondToDate(msd) {
    var time = parseFloat(msd) / 1000;
    if (null != time && "" != time) {
        if (time > 60 && time < 60 * 60) {
            time = parseInt(time / 60.0) + "分" + parseInt((parseFloat(time / 60.0) -
                parseInt(time / 60.0)) * 60) + "秒";
        }
        // else if (time >= 60 * 60 && time < 60 * 60 * 24) {
        else if (time >= 60 * 60) {
            time = parseInt(time / 3600.0) + "时" + parseInt((parseFloat(time / 3600.0) -
                parseInt(time / 3600.0)) * 60) + "分" +
                parseInt((parseFloat((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60) -
                parseInt((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60)) * 60) + "秒";
        }
        else {
            time = parseInt(time) + "秒";
        }
    }
    return time;
}

function get_unix_time(dateStr){
    var newstr = dateStr.replace(/-/g,'/'); 
    var date =  new Date(newstr); 
    var time_str = date.getTime().toString();
    return time_str;
}

@media only screen and (max-width:300px){body{font-size:8.33333px}.viewport{max-width:300px}}
@media only screen and (max-width:310px) and (min-width:300px){body{font-size:8.33333px}.viewport{max-width:310px}}
@media only screen and (max-width:320px) and (min-width:310px){body{font-size:8.61111px}.viewport{max-width:320px}}
@media only screen and (max-width:350px) and (min-width:320px){body{font-size:8.88889px}.viewport{max-width:350px}}
@media only screen and (max-width:360px) and (min-width:350px){body{font-size:9.72222px}.viewport{max-width:360px}}
@media only screen and (max-width:400px) and (min-width:360px){body{font-size:10px}.viewport{max-width:400px}}
@media only screen and (max-width:470px) and (min-width:400px){body{font-size:11.11111px}.viewport{max-width:470px}}
@media only screen and (max-width:480px) and (min-width:470px){body{font-size:13.05556px}.viewport{max-width:480px}}
@media only screen and (max-width:540px) and (min-width:480px){body{font-size:13.33333px}.viewport{max-width:540px}}
@media only screen and (max-width:560px) and (min-width:540px){body{font-size:15px}.viewport{max-width:560px}}
@media only screen and (max-width:570px) and (min-width:560px){body{font-size:15.55556px}.viewport{max-width:570px}}
@media only screen and (max-width:630px) and (min-width:570px){body{font-size:15.83333px}.viewport{max-width:630px}}
@media only screen and (max-width:640px) and (min-width:630px){body{font-size:17.5px}.viewport{max-width:640px}}
@media only screen and (max-width:710px) and (min-width:640px){body{font-size:17.77778px}.viewport{max-width:710px}}
@media only screen and (max-width:720px) and (min-width:710px){body{font-size:19.72222px}.viewport{max-width:720px}}
@media only screen and (min-width:720px){body{font-size:20px}.viewport{width:720px}}

» 阅读全文

火狐和webkit核心浏览器的属性名字不一样，谁叫不是一个娘生的呢。

/* webkit 浏览器*/
#field1::-webkit-input-placeholder { color:#00f; }
#field2::-webkit-input-placeholder {
	color:#090;
	background:lightgreen;
	text-transform:uppercase;
}
#field3::-webkit-input-placeholder {
	font-style:italic;
	text-decoration:overline;
	letter-spacing:3px;
	color:#999;
}
/* 火狐浏览器 */
#field1::-moz-placeholder { color:#00f; }
#field2::-moz-placeholder {
	color:#090;
	background:lightgreen;
	text-transform:uppercase;
}
#field3::-moz-placeholder {
	font-style:italic;
	text-decoration:overline;
	letter-spacing:3px;
	color:#999;
}