Nginx配置iconfont字体支持跨域

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net

使用location匹配

1
2
3
4
5
6
7
server {
root /webserver;

location ~* \.(eot|otf|ttf|woff|svg)$ {
add_header Access-Control-Allow-Origin *;
}
}

使用if判断匹配

1
2
3
4
5
6
7
8
9
server {
root /webserver;

location / {
if ($document_uri ~ \.(eot|otf|ttf|woff|svg)$) {
add_header Access-Control-Allow-Origin *;
}
}
}
  • 其中的*指匹配任意域名, 也可以是指定的域名, 如: http://barretlee.com
  • eot|otf|ttf|woff|svg表示匹配的字体文件

Nginx配置接口,获取服务器时间,支持 jsonp

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
server {
listen 80;
server_name barretlee.com

default_type: "text/html";
error_page default;
charset off;
gzip off;
beacon off;

location = /gettime {
set $uri_param_cb "callback";
if ($arg_callback ~ "(^[^/<>]+$)" ) {set $uri_param_cb $1; }
return 200 "$uri_param_cb({\"time\":\"$unix_time\"})";
}
}

使用方式:

1
2
3
4
//GET http://server_name/gettime
{
"time": "1444284923"
}

mac所有命令

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net

  alias     Create an alias •
  alloc     List used and free memory
  apropos   Search the whatis database for strings
  asr       Apple Software Restore
  awk       Find and Replace text within file(s)
b
  basename  Convert a full pathname to just a filename
  bash      Bourne-Again SHell
  bg        Send to background •
  bind      Display readline key and function bindings •
  bless     Set volume bootability and startup disk options
  break     Exit from a For, While, Until or Select loop •
  builtin   Execute a shell builtin •
  bzip2     Compress or decompress files
c
  cal       Display a calendar
  calendar  Reminder Service
  caller    Return the context of a subroutine call •
  case      Conditionally perform a command •
  cat       Concatenate and print (display) the content of files
  cd        Change Directory •
  chflags   Change a file or folder's flags
  chgrp     Change group ownership
  chmod     Change access permissions
  chown     Change file owner and group
  chroot    Run a command with a different root directory
  cksum     Print CRC checksum and byte counts
  clear     Clear terminal screen
  cmp       Compare two files
  comm      Compare two sorted files line by line
  command   Run a command (not a function) •
  complete  Edit a command completion [word/pattern/list] •
  continue  Resume the next iteration of a loop •
  cp        Copy one or more files to another location
  cron      Daemon to execute scheduled commands
  crontab   Schedule a command to run at a later date/time
  csplit    Split a file into context-determined pieces
  curl      Transfer data  from or to a server
  cut       Divide a file into several parts
d
  date      Display or change the date & time
  dc        Desk Calculator
  dd        Convert and copy a file, clone disks
  declare   Declare variable & set attributes •
  defaults  Set preferences, show hidden files
  df        Display free disk space
  diff      Display the differences between two files
  diff3     Show differences among three files
  dig       DNS lookup
  dirname   Convert a full pathname to just a path
  dirs      Display list of remembered directories •
  diskutil  Disk utilities - Format, Verify, Repair
  disown    Unbind a job from the current login session •
  ditto     Copy files and folders
  dot_clean Remove dot-underscore files
  drutil    Interact with CD/DVD burners
  dscacheutil  Query or flush the Directory Service/DNS cache
  dseditgroup  Edit, create, manipulate, or delete groups
  dsenableroot Enable root access
  dsmemberutil View user and groups rights
  dscl      Directory Service command line utility
  du        Estimate file space usage
e
  echo      Display text on screen •
  ed        A line-oriented text editor (edlin)
  enable    Enable and disable builtin shell commands •
  env       List or Set environment variables
  eval      Evaluate several commands/arguments •
  exec      Execute a command •
  exit      Exit the shell •
  expand    Convert tabs to spaces
  expect    Programmed dialogue with interactive programs
            Also see AppleScript
  export    Set an environment variable •
  expr      Evaluate expressions
f
  false     Do nothing, unsuccessfully
  fc        Fix command (history)
  fdisk     Partition table manipulator for Darwin UFS/HFS/DOS
  fg        Send job to foreground •
  file      Determine file type
  find      Search for files that meet a desired criteria
  fmt       Reformat paragraph text
  fold      Wrap text to fit a specified width
  for       Loop command •
  fsck      Filesystem consistency check and repair
  fsaclctl  Filesystem enable/disable ACL support
  fs_usage  Filesystem usage (process/pathname)
  ftp       Internet file transfer program
  function  Define Function Macros
g
  GetFileInfo Get attributes of HFS+ files
  getopt    Parse positional parameters
  getopts   Parse positional parameters •
  goto      Jump to label and continue execution
  grep      Search file(s) for lines that match a given pattern
  groups    Print group names a user is in
  gzip      Compress or decompress files
h
  halt      Stop and restart the operating system
  hash      Refresh the cached/remembered location of commands •
  head      Display the first lines of a file
  hdiutil   Manipulate iso disk images
  history   Command History •
  hostname  Print or set system name
i
  iconv     Convert the character set of a file
  id        Print user and group names/id's
  if        Conditionally perform a command •
  ifconfig  Configure network interface parameters
  ipconfig  View and control IP configuration state
  info      Help info
  install   Copy files and set attributes
j
  jobs      List active jobs •
  join      Join lines on a common field
k
  kextfind  List kernel extensions
  kickstart Configure Apple Remote Desktop
  kill      Kill a process by specifying its PID
  killall   Kill processes by name
l
  l         List files in long format (ls -l)
  last      Indicate last logins of users and ttys
  launchctl Load or unload daemons/agents
  ll        List files in long format, showing invisible files (ls -la)
  less      Display output one screen at a time
  let       Evaluate expression •
  lipo      Convert a universal binary
  ln        Make links between files (hard links, symbolic links)
  local     Set a local (function) variable •
  locate    Find files
  logname   Print current login name
  login     log into the computer
  logout    Exit a login shell (bye) •
  look      Display lines beginning with a given string
  lpr       Print files
  lprm      Remove jobs from the print queue
  lpstat    Printer status information
  ls        List information about file(s)
  lsregister Reset the Launch Services database
  lsbom     List a bill of materials file
  lsof      List open files
m
  man       Help manual
  mdfind    Spotlight search
  mdutil    Manage Spotlight metadata store
  mkdir     Create new folder(s)
  mkfifo    Make FIFOs (named pipes)
  more      Display output one screen at a time
  mount     Mount a file system
  mv        Move or rename files or directories
n
  nano      Simple text editor
  net       Manage network resources
  netstat   Show network status
  networksetup Network and System Preferences
  nice      Set the priority of a command
  nohup     Run a command immune to hangups
  ntfs.util NTFS file system utility
o
  onintr    Control the action of a shell interrupt
  open      Open a file/folder/URL/Application
  opensnoop Snoop file opens as they occur
  osacompile Compile Applescript
  osascript Execute AppleScript
p
  passwd    Modify a user password
  paste     Merge lines of files
  pbcopy    Copy data to the clipboard
  pbpaste   Paste data from the Clipboard
  ping      Test a network connection
  pkill     Kill processes by a full or partial name
  pkgutil   Query and manipulate installed packages
plutil Property list utility pmset Power Management settings popd Restore the previous value of the current directory • pr Convert text files for printing printenv List environment variables printf Format and print data • ps Process status pushd Save and then change the current directory pwd Print Working Directory • q quota Display disk usage and limits r rcp Copy files between machines read Read one line from standard input • readonly Mark a variable or function as read-only • reboot Stop and restart the system return Exit a function • rev Reverse lines of a file rm Remove files rmdir Remove folder(s) rpm Remote Package Manager rsync Remote file copy - Sync file tree s say Convert text to audible speech screen Multiplex terminal, run remote shells via ssh screencapture Capture screen image to file or disk scutil Manage system configuration parameters sdiff Merge two files interactively security Administer Keychains, keys, certificates and the Security framework sed Stream Editor select Generate a list of items • set Set a shell variable = value • setfile Set attributes of HFS+ files shasum Print or Check SHA Checksums shift Shift positional parameters • shopt Set shell options • shutdown Shutdown or restart OS X sips Scriptable image processing system sleep Delay for a specified time softwareupdate System software update tool sort Sort text files source Execute commands from a file • split Split a file into fixed-size pieces stat Display the status of a file stop Stop a job or process su Substitute user identity sudo Execute a command as another user sum Print a checksum for a file suspend Suspend execution of this shell • sw_vers Print Mac OS X operating system version system_profiler Report system configuration systemsetup Computer and display system settings t tail Output the last part of files tar Tape ARchiver tcpdump Dump traffic on a network tee Redirect output to multiple files test Condition evaluation • textutil Manipulate text files in various formats (Doc,html,rtf) time Measure Program Resource Use times Print shell & shell process times • tmutil Time Machine utility top Display process information touch Change file timestamps tput Set terminal-dependent capabilities, color, position tr Translate, squeeze, and/or delete characters trap Execute a command when the shell receives a signal • traceroute Trace Route to Host true Do nothing, successfully tty Print filename of terminal on stdin type Describe a command • u ufs.util Mount/unmount UFS file system ulimit limit the use of system-wide resources • umask Users file creation mask umount Unmount a device unalias Remove an alias • uname Print system information unexpand Convert spaces to tabs uniq Uniquify files units Convert units from one scale to another unset Remove variable or function names • until Loop command • uptime Show how long system has been running users Print login names of users currently logged in uuencode Encode a binary file uudecode Decode a file created by uuencode uuidgen Generate a Unique ID (UUID/GUID) uucp Unix to Unix copy v vi Text Editor w wait Wait for a process to complete • wc Print byte, word, and line counts whatis Search the whatis database for complete words whereis Locate a program which Locate a program file in the user's path while Loop command • who Print all usernames currently logged on whoami Print the current user id and name (`id -un') write Send a message to another user x xargs Execute utility - passing arguments xattr Display and manipulate extended attributes youtube-dl Download video yes Print a string until interrupted zip Package and compress (archive) files. !! Run the last command again

less mixin

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
.text-shadow (@string: 0 1px 3px rgba(0, 0, 0, 0.25)) {
text-shadow: @string;
}
.box-shadow (@string) {
-webkit-box-shadow: @string;
-moz-box-shadow: @string;
box-shadow: @string;
}
.drop-shadow (@x: 0, @y: 1px, @blur: 2px, @spread: 0, @alpha: 0.25) {
-webkit-box-shadow: @x @y @blur @spread rgba(0, 0, 0, @alpha);
-moz-box-shadow: @x @y @blur @spread rgba(0, 0, 0, @alpha);
box-shadow: @x @y @blur @spread rgba(0, 0, 0, @alpha);
}
.inner-shadow (@x: 0, @y: 1px, @blur: 2px, @spread: 0, @alpha: 0.25) {
-webkit-box-shadow: inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
-moz-box-shadow: inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
box-shadow: inset @x @y @blur @spread rgba(0, 0, 0, @alpha);
}

.box-sizing (@type: border-box) {
-webkit-box-sizing: @type;
-moz-box-sizing: @type;
box-sizing: @type;
}

.border-radius (@radius: 5px) {
-webkit-border-radius: @radius;
-moz-border-radius: @radius;
border-radius: @radius;

-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
.border-radiuses (@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) {
-webkit-border-top-right-radius: @topright;
-webkit-border-bottom-right-radius: @bottomright;
-webkit-border-bottom-left-radius: @bottomleft;
-webkit-border-top-left-radius: @topleft;

-moz-border-radius-topright: @topright;
-moz-border-radius-bottomright: @bottomright;
-moz-border-radius-bottomleft: @bottomleft;
-moz-border-radius-topleft: @topleft;

border-top-right-radius: @topright;
border-bottom-right-radius: @bottomright;
border-bottom-left-radius: @bottomleft;
border-top-left-radius: @topleft;

-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}

.opacity (@opacity: 0.5) {
-webkit-opacity: @opacity;
-moz-opacity: @opacity;
opacity: @opacity;
}

.gradient (@startColor: #eee, @endColor: white) {
background-color: @startColor;
background: -webkit-gradient(linear, left top, left bottom, from(@startColor), to(@endColor));
background: -webkit-linear-gradient(top, @startColor, @endColor);
background: -moz-linear-gradient(top, @startColor, @endColor);
background: -ms-linear-gradient(top, @startColor, @endColor);
background: -o-linear-gradient(top, @startColor, @endColor);
}
.horizontal-gradient (@startColor: #eee, @endColor: white) {
background-color: @startColor;
background-image: -webkit-gradient(linear, left top, right top, from(@startColor), to(@endColor));
background-image: -webkit-linear-gradient(left, @startColor, @endColor);
background-image: -moz-linear-gradient(left, @startColor, @endColor);
background-image: -ms-linear-gradient(left, @startColor, @endColor);
background-image: -o-linear-gradient(left, @startColor, @endColor);
}

.animation (@name, @duration: 300ms, @delay: 0, @ease: ease) {
-webkit-animation: @name @duration @delay @ease;
-moz-animation: @name @duration @delay @ease;
-ms-animation: @name @duration @delay @ease;
}

.transition (@transition) {
-webkit-transition: @transition;
-moz-transition: @transition;
-ms-transition: @transition;
-o-transition: @transition;
}
.transform(@string){
-webkit-transform: @string;
-moz-transform: @string;
-ms-transform: @string;
-o-transform: @string;
}
.scale (@factor) {
-webkit-transform: scale(@factor);
-moz-transform: scale(@factor);
-ms-transform: scale(@factor);
-o-transform: scale(@factor);
}
.rotate (@deg) {
-webkit-transform: rotate(@deg);
-moz-transform: rotate(@deg);
-ms-transform: rotate(@deg);
-o-transform: rotate(@deg);
}
.skew (@deg, @deg2) {
-webkit-transform: skew(@deg, @deg2);
-moz-transform: skew(@deg, @deg2);
-ms-transform: skew(@deg, @deg2);
-o-transform: skew(@deg, @deg2);
}
.translate (@x, @y:0) {
-webkit-transform: translate(@x, @y);
-moz-transform: translate(@x, @y);
-ms-transform: translate(@x, @y);
-o-transform: translate(@x, @y);
}
.translate3d (@x, @y: 0, @z: 0) {
-webkit-transform: translate3d(@x, @y, @z);
-moz-transform: translate3d(@x, @y, @z);
-ms-transform: translate3d(@x, @y, @z);
-o-transform: translate3d(@x, @y, @z);
}
.perspective (@value: 1000) {
-webkit-perspective: @value;
-moz-perspective: @value;
-ms-perspective: @value;
perspective: @value;
}
.transform-origin (@x:center, @y:center) {
-webkit-transform-origin: @x @y;
-moz-transform-origin: @x @y;
-ms-transform-origin: @x @y;
-o-transform-origin: @x @y;
}

图片垂直居中

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net
感谢neekey贡献代码!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
/**
* 图片的垂直居中,注意容器不能设置float,会破坏display的效果,有需要建议在外层增加一层div包裹
*
* 正常使用,将该方法设置给img的父元素即可:
* div.pic-wrapper
* img
* 若元素需要float:
* div.float
* div.pic-wrapper
* img
* @param width
* @param height
*/
.image-middle(@width, @height) when(ispixel(@height)) {

// 非IE的主流浏览器识别的垂直居中的方法
display: table-cell;
vertical-align:middle;
text-align:center;
height: @height;
width: @width;

// 针对IE678最垂直居中
// 针对IE的Hack
display: ~'block\0';/* ie 8/9*/
display: ~'table-cell\9\0';/* ie 9*/
*display: block;

*font-size: @height * 0.873;

line-height: ~'@{height}\0';/* ie 8/9*/
line-height: ~'inherit\9\0';/* ie 9*/
*line-height: @height;
// 防止非utf-8引起的hack失效问题,如gbk编码
*font-family:Arial;

img {
max-height: @height;
max-width: @width;
vertical-align: middle;
}
}

/**
* 兼容一个参数的写法,长宽相等
*/
.image-middle(@square:60px){
.image-middle(@square, @square);
}

按字节截取字符串

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net
Author: 吕大豹
Email: 670818517(at)qq.com

按字节截取字符串,使用示例:subSt(‘我是中国人’, 4); //我是

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function subSt(str, len){
var newLength = 0;
var newStr = "";
var chineseRegex = /[^\x00-\xff]/g;
var singleChar = "";
var strLength = str.replace(chineseRegex,"**").length;
for(var i = 0;i < strLength;i++) {
singleChar = str.charAt(i).toString();
if(singleChar.match(chineseRegex) != null) {
newLength += 2;
} else {
newLength++;
}
if(newLength > len) {
break;
}
newStr += singleChar;
}
return newStr;
}

中文转拼音

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net
关键操作是利用 localeCompare 对比。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
/**/~(function(){/**/
//二分法汉字转拼音
var key = "吖哎安肮凹八挀扳邦勹陂奔伻皀边灬憋汃冫癶峬嚓偲参仓撡冊嵾噌叉犲辿伥抄车抻阷吃充抽出膗巛刅吹旾踔呲从凑粗汆镩蹿崔邨搓咑呆丹当刀恴揼灯仾嗲敁刁爹丁丟东吺剢耑叾吨多妸奀鞥仒发帆匚飞分丰覅仏垺夫旮侅干冈皋戈给根更工勾估瓜乖关光归丨呙妎咍兯夯茠诃黒拫亨乊叿齁乎花怀欢巟灰昏吙丌加戋江艽阶巾坕冂丩凥姢噘军咔开刊忼尻匼肎劥空廤扝夸蒯宽匡亏坤扩垃来兰啷捞仂雷塄唎俩嫾簗蹽咧厸伶溜咯龙娄噜驴孪掠抡捋嘸妈埋颟牤猫庅呅椚掹踎宀喵乜民名谬摸哞某母拏腉囡囔孬疒娞嫩莻妮拈娘鸟捏脌宁妞农羺奴女疟奻硸噢妑拍眅乓抛呸喷匉丕片剽氕姘乒钋剖仆七掐千呛悄切亲靑宆丘区峑炔夋亽呥穣荛惹人扔日戎厹嶿堧桵闰挼仨毢三桒掻色杀筛山伤弰奢申升尸収书刷衰闩双谁妁厶忪凁苏狻夊孙唆他囼坍汤仐忑膯剔天旫怗厅囲偷凸湍推吞乇屲歪乛尣危塭翁挝乌夕呷仙乡灱些忄兴凶休戌吅疶坃丫咽央幺倻膶一乚应哟佣优扜囦曰蒀帀災兂牂傮啫贼怎曽吒夈沾张佋蜇贞凧之中州朱抓拽专妆隹宒卓仔孖宗邹租劗厜尊昨".split("");
var pinyin = "AAiAnAngAoBaBaiBanBangBaoBeiBenBengBiBianBiaoBieBinBingBoBuCaCaiCanCangCaoCeCenCengChaChaiChanChangChaoCheChenChengChiChongChouChuChuaiChuanChuangChuiChunChuoCiCongCouCuCuanChuanCuanCuiCunCuoDaDaiDanDangDaoDeDenDengDiDiaDianDiaoDieDingDiuDongDouDuDuanDuiDunDuoEEnEngErFaFanFangFeiFenFengFiaoFoFouFuGaGaiGanGangGaoGeGeiGenGengGongGouGuGuaGuaiGuanGuangGuiGunGuoHaHaiHanHangHaoHeHeiHenHengHoHongHouHuHuaHuaiHuanHuangHuiHunHuoJiJiaJianJiangJiaoJieJinJingJiongJiuJuJuanJueJunKaKaiKanKangKaoKeKenKengKongKouKuKuaKuaiKuanKuangKuiKunKuoLaLaiLanLangLaoLeLeiLengLiLiaLianLiangLiaoLieLinLingLiuLoLongLouLuLvLuanLveLunLuoMMaMaiManMangMaoMeMeiMenMengMiMianMiaoMieMinMingMiuMoMouMeiMuNaNaiNanNangNaoNeNeiNenNNiNianNiangNiaoNieNinNingNiuNongNouNuNvNveNuanNuoOuPaPaiPanPangPaoPeiPenPengPiPianPiaoPiePinPingPoPouPuQiQiaQianQiangQiaoQieQinQingQiongQiuQuQuanQueQunRaRanRangRaoReRenRengRiRongRouRuRuanRuiRunRuoSaSaiSanSangSaoSeShaShaiShanShangShaoSheShenShengShiShouShuShuaShuaiShuanShuangShuiShuoSiSongSouSuSuanSuiSunSuoTaTaiTanTangTaoTeTengTiTianTiaoTieTingTongTouTuTuanTuiTunTuoWaWaiWanWangWeiWenWengWoWuXiXiaXianXiangXiaoXieXinXingXiongXiuXuXuanXueXunYaYanYangYaoYeYenYiYinYingYoYongYouYuYuanYueYunZaZaiZanZangZaoZeZeiZenZengZhaZhaiZhanZhangZhaoZheZhenZhengZhiZhongZhouZhuZhuaZhuaiZhuanZhuangZhuiZhunZhuoZaiZiZongZouZuZuanZuiZunZuo".split(/(?=[A-Z])/g);
var cache = {};
var keyLen=key.length-1;

return function pinyinFn(w){

if(w.length>1){
var ret='';
for(var i=0;i<w.length;i++){
ret+=pinyinFn(w.charAt(i))
}
return ret;
}

if(!/[\u4e00-\u9fa5]/.test(w)){
return w;
}

if(cache[w]){
return cache[w];
}

var begin=0;

var end=keyLen;

while(begin<=end){
var middle = Math.floor((begin+end)/2);
if(w.localeCompare(key[middle])<0){
end=middle-1;
} else {
begin=middle+1;
}
}

return cache[w] = pinyin[end];

};
/**/}());/**/

检测 html 代码的书签

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net

1
javascript:(function(){ %20function%20fixFileUrl(u)%20{ %20var%20windows,u;%20windows%20=%20(navigator.platform.indexOf("Win")%20!=%20-1);%20%20/*%20chop%20off%20file:///,%20unescape%20each%20%hh,%20convert%20/%20to%20\%20and%20|%20to%20:%20*/%20%20u%20=%20u.substr(windows%20?%208%20:%207);%20u%20=%20unescape(u);%20if(windows)%20{ %20u%20=%20u.replace(/\//g,"\");%20u%20=%20u.replace(/\|/g,":");%20}%20return%20u;%20}%20/*%20bookmarklet%20body%20*/%20var%20loc,fileloc;%20loc%20=%20document.location.href;%20if%20(loc.length%20>%209%20&&%20loc.substr(0,8)=="file:///")%20{ %20fileloc%20=%20fixFileUrl(loc);%20if%20(prompt("Copy%20filename%20to%20clipboard,%20press%20enter,%20paste%20into%20validator%20form",%20fileloc)%20!=%20null)%20{ %20document.location.href%20=%20"http://validator.w3.org/file-upload.html"%20}%20}%20else%20document.location.href%20=%20"http://validator.w3.org/check?uri="%20+%20escape(document.location.href);%20void(0);%20})();

Firebug脚本

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net

1
<script type='text/javascript' src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>

可以将此保存为书签:

将此拖到书签栏

书签代码:

1
javascript:var firebug=document.createElement('script');firebug.setAttribute('src','http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js');document.body.appendChild(firebug);(function(){if(window.firebug.version){firebug.init();}else{setTimeout(arguments.callee);}})();void(firebug);

touchstart 事件防抖动

原文来自:snippets.barretlee.com,只是为了自己学习收集特意fork了一遍。如有侵权,联系删除:i@webcliwn.net
一个元素上可能监听了多个事件,比如 drag、swipe、tap 等,比如顶部导航,我们在导航元素上注册了 touchstart 事件用来统计子导航的单击量,由于导航过长,我们还为其注册了一个 drag 事件,向左拖动查看右侧更多子导航。

此时简单的 drag 拖动就可能触发 touchstart 事件,造成无效点击统计。

下面是一个简单的处理方案:如果元素上存在 mark 属性,当 touchstart 时拿到 event.target 和它所有父元素的 scrollTop & scrollLeft 值,touchend 的时候判断这些 scrollTop & scrollLeft 值变化 delta 是否大于 20px,如果大于则阻止 touchstart 上的注册事件 doSomethingWhenTouchStart

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
$('[mark]').on('touchstart', function(evt) {
var target = $(evt.target);
while(target) {
(evt.target.scrollInit = evt.target.scrollInit || []).push({
t: target.scrollTop(),
l: target.scrollLeft()
});
target = $(target).parent();
}
}).on('touchend touchcancel', function(evt){
var target = $(evt.target);
var scrollInit = evt.target.scrollInit;
var index = 0;
while (target) {
var deltaY = target.scrollTop() - scrollInit[index].t;
var deltaX = target.scrollLeft() - scrollInit[index].l;
if(Math.abs(deltaX) >= 20 || Math.abs(deltaY) >= 20) {
return;
}
target = $(target).parent();
index++;
}
delete evt.target.scrollInit;
// doSomethingWhenTouchStart();
});