## File Upload # Server side setting ## php.ini in Mac
/etc/php.ini file_uploads = On upload_max_filesize = 10M post_max_size = 10M file_uploads # 預設為on,允許用HTTP協定上傳 upload_tmp_dir # 上傳檔案暫存目錄,wamp5中,c:/wamp/tmp upload_max_filesize # 上傳檔案最大值 post_max_size # 利用 post 傳送數據所用最大值(利用 AJAX 或 post 上傳會有影響) max_execution_time # PHP執行時間最大值,預設為30秒 # style 由於預設的 <input type="file"> 樣式不好改，且每一個 broswer 預設的樣式都不一樣，所以都會希望用統一化的客制化樣式，但基本上不太可能把它的樣式改成所想要的客制化的樣式，除非直接用像 Bootstrap 之類的框架
## solution 1(hack) 把 <input type="file"> 的 style 設成 opacity: 0; 蓋在客制化的 button 上，也必須要設成跟客制化寬高一樣，以免覆蓋面積不一樣
CSS .btn, .file-select { width: 80px; height: 30px; } .
...
# command ## User su / sudo # 最高權限使用者 su -u <user name> bash # 切換使用者 exit # 跳出最高權限使用者 shutdown # 關機 shutdown -h now 立即關機 shutdown -h +m m分鐘後關機 shutdown -h hh:mm 幾點幾分關機 reboot # 重開機 login # 登入使用者 logout / exit # 登出 passwd # 修改密碼 useradd / adduser # 新增帳號 passwd # 修改密碼 sudo -u <user name> <shell> # 切換使用者 date # 顯示時間 date 月日時分(root修改) history # 顯示輸入過的指令 ps # 顯示目前執行的工作 chmod <777> # 修改權限 # rwx # 2*2 2 1 chown <user>:<user> <file> # 修改該 file owner uname -a # 確認 system OS uanme -r # linux kernel df # 確認硬碟空間 ## File Management ls # 列出檔案 ls -a 列出以.
...
# function account captcha validation use bootatrap model # result captcha fail captcha ok backend check account success fail(not exist) # method ajax # mockup link
# flow click forget password show model enter account & captcha(validation from js not null) submit(ajax) account fail(from backend) -> show message captcha fail(from backend) -> show message success -> show message
# flow(detail) 點擊忘記密碼 秀 bootstrap model 輸入帳號與驗證碼(利用 validation 作必填的檢查) 用 ajax 的方式送出
...
# modulize modulize selector var module = $('body'); module.on('click', 'a', function() { // dosomething... }); initialize if ($('body').length) { // dosomething } # selector id is better than tag and class
HTML
<div> <ul> <li id="id" class="class">text</li> </ul> </div> JavaScript
$('#id').html(); $('body').find('#id'); jsperf
##bind event use on bind on parent selector
$('ul').on('click', 'li', function () { // dosomething }); js Bin
...
# innerHeight & innerWidth 抓取瀏覽器目前顯示高度與寬度 一般都用
window.innerHeight 與
window.innerWidth 但唯獨IE6~IE8不行 Google了一下 發現用
window.document.documentElement.clientHeight 與
window.document.documentElement.clientWidth 便兼容所有瀏覽器
# scrollHeight 如要抓 document 的高可用
document.body.scrollHeight Refer
...
* 所有元素
E 所有E元素，
E:nth-child(n) 傳回在所屬父元素下，排行第 n 的元素 E。(注意: 從 1 開始算，而非從 0)
E:first-child 傳回在所屬父元素下，排行第一的元素(老大)
E:last-child 傳回在所屬父元素下，排行最後的元素(老么)
E:only-child 傳回在所屬父元素下，是唯一子元素(獨子)
E:empty 沒有任何子元素者(有文字也不算，例如 <span>TEXT</span> 就不合格)
E:enabled 未被停用的 UI 元素 E
E:disabled 被停用的 UI 元素 E
E:checked 被勾選的 UI 元素 E(適用於 Radio, Checkbox)
E:selected 被選取的 UI 元素 E(適用於 Select 下的 Option 元素)
E.myClassName CSS 類別設為 myClassName 的元素 E
E#myId id="myId" 的元素 E
E:not(s) 不符合 s 條件的元素 E，例如: $("span:not(:empty)") 即為找出有包含子元素的 span
E F 由包含在 E 底下的 F 元素，不必直接為父子關係，例如: F 可以是 E 的子元素的子元素。
E > F 找出父元素為 E 的 F 元素
E + F 找出緊接在 E 元素後方的 F 元素
E ~ F 找出緊接在 E 元素前方的 F 元素
E,F,G 利用逗號可以呈現 " 或 " 的聯集效果，指 E 元素或 F 元素或 G 元素
E[foo] 具有 foo 屬性 (Attribute) 的E元素(1.
...
# performance jsPerf — JavaScript performance playground http://jsperf.com/
HTML5 test http://html5test.com/
JavaScript Benchmark http://www.webkit.org/perf/sunspider/sunspider.html
var perf = function (testName, fn) { var startTime = new Date().getTime(); fn(); var endTime = new Date().getTime(); console.log(testName + ": " + (endTime - startTime) + "ms"); } jQuery console.time("timerName"); // javascript console.timeEnd("timerName");
...
# Browser Browser detect 由於各大瀏覽器都有部分CSS或Javascript相容問題,所以找了判斷各家瀏覽器的語法
在github 上更新
github
...
# fileUpload by yui library ## init upload button JavaScript bind click event in IE use JavaScript move CSS position
uploader : Upload file uploaderOut : handle not drag area ## event ### fileSelect select file & render upload list check file status handle fileList _upload
### uploadprogress upload file progress
### uploadcomplete upload complete check ok or fail _upload
### uploaderror cancel & upload next
### _upload check file status & upload status upload upload fileList[uploadfile]
...
Hi, This a demo post of Logdown.
Logdown use Markdown as main syntax, you can find more example by reading this document on Wikipedia
Logdown also support drag & drop image uploading ( required Beta / Premium membership). The picture syntax is like this:
# Bloging with code snippet: inline code
## Plain Code puts "Hello World!" ## Code with Language puts "Hello World!" ## Code with Title puts "Hello World!
...