1.yum
yum –y install p7zip
2.gcc-c++
wget http://nchc.dl.sourceforge.net/sourceforge/p7zip/p7zip_4.65_src_all.tar.bz2
tar -xjvf p7zip_4.65_src_all.tar.bz2
cd p7zip_4.65
make
make install
1、NPM (http://npmjs.org/)
curl http://npmjs.org/install.sh | sh
2、Node WebSocket Server
https://github.com/miksago/node-websocket-server
npm install websocket-server
0，基本环境
yum install gcc-c++ openssl-devel
1，获取最新版本
https://github.com/joyent/node
2，解压
tar -xzvf node.0.4.XX.tar.gz
3，进入解压目录
./configure
make
make install
4，也！成功
Apple-specific meta tags are described here.
Sets the style of the status bar for a web application.
Syntax
<meta name="apple-mobile-web-app-status-bar-style" content="black"> |
Discussion
content is set to default, the status bar appears normal. If set to black, the status bar has a black background. If set to black-translucent, the status bar is black and translucent. If set to default or black, the web content is displayed below the status bar. If set to black-translucent, the web content is displayed on the entire screen, partially obscured by the status bar. The default value is default.
Availability
Support Level
这次是4月16和17日两天都有议题的研讨会。由于女儿报名幼儿园和自己正在学车，所以第一天的内容错过了。17号参加了上午的内容。
HTML5设计理念的发言之后，有个360浏览器的同学问现在HTML5的代码写法这么不严格，会不会导致很多的网站越写越烂那么浏览器就会很累。
其实我老想说的，现在中国的状况是各大山寨浏览器横行，你们在IE或者webkit内核上做的莫名修改让前端同学们已经很郁闷了。
我真心希望国内能有类似WHATWG的组织，可以请你们讲讲我们网站要怎么配合你们。
现在当市场部或者客服说，哎呀用户用360 或者遨游上我们网站有问题啊。
目前完全没有办法重现问题，根本没办法整啊，谁知道你们用的是啥核心，每一次升级又改了什么？
key point:
e.preventDefault();
var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /> <title>moblie test</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript" ></script> <style> html, body { margin: 0; padding: 0;} .droginfo { width:100%; height:40px; background:#ffc;line-height:18px} .droginfo div {width:100px; float:left;} .drogbox {background: #333377; clear: left; min-height: 240px; min-width: 320px; max-width:480px; position: relative; overflow:hidden; } #moveBox {width:3200px; height:200px; position:absolute; left:0; top:20px; background: #ddd; padding: 0;} #moveBox .photo { width:150px; height:180px; padding: 10px 5px; float:left; } </style> </head><body> <div class="drogbox"> <div id="moveBox"> <img class="photo" src="http://www.glamour-sales.com.cn/media/catalog/product/yv/s/YR0-518-00007.jpg" /> <img class="photo" src="http://www.glamour-sales.com.cn/media/catalog/product/yv/s/YR0-518-00006.jpg" /> <img class="photo" src="http://www.glamour-sales.com.cn/media/catalog/product/yv/s/YR0-518-00005.jpg" /> <img class="photo" src="http://www.glamour-sales.com.cn/media/catalog/product/yv/s/YR0-518-00004.jpg" /> <img class="photo" src="http://www.glamour-sales.com.cn/media/catalog/product/yv/s/YR0-518-00003.jpg" /> <img class="photo" src="http://www.glamour-sales.com.cn/media/catalog/product/yv/s/YR0-518-00002.jpg" /><img class="photo" src="http://www.glamour-sales.com.cn/media/catalog/product/yv/s/YR0-518-00001.jpg" /> </div> </div> <div class="droginfo"> <div>pageX:<span id="movex" ></span></div> <div>pageY:<span id="movey" ></span></div> <div>changeX:<span id="changex" ></span></div> <div>autofix:<span id="moveend" ></span></div></div> <script type="text/javascript"> var changeXOld = 0; var changeXNew = 0; var firstTouchX = 0; var moveThing = jQuery('#moveBox'); var moveList = jQuery('#moveBox img').length; jQuery('#moveBox').width( moveList * 160); jQuery('.drogbox').bind('touchstart',function(e){ var moveBoxoffset = moveThing.offset(); e.preventDefault(); var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; changeXOld = moveBoxoffset .left; firstTouchX = touch.pageX; }).bind('touchmove',function(e){ e.preventDefault(); var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; var elm = jQuery(this).offset(); var x = touch.pageX - elm.left; var y = touch.pageY - elm.top; if(x < jQuery(this).width() && x > 0){ if(y < jQuery(this).height() && y > 0){ //CODE GOES HERE //console.log(touch.pageY+' '+touch.pageX); jQuery('#movex').text(touch.pageX); jQuery('#movey').text(touch.pageY); jQuery('#changex').text(changeXOld + "," + changeXNew ); jQuery('#moveend').text(''); } } var newXpoint = (changeXOld - ( firstTouchX - touch.pageX)) + 'px'; jQuery('#moveBox').css("left",newXpoint); }).bind('touchend',function(e){ e.preventDefault(); var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; var moveBoxoffset = moveThing.offset(); var maxLeft = moveThing.width(); changeXNew = moveBoxoffset .left; jQuery('#changex').text(changeXOld + "," + changeXNew); var jumpX = jQuery('.drogbox').width(); var drogChange = changeXNew - changeXOld ; if ( drogChange > 10 ) { var newXpoint = ( (parseInt(moveBoxoffset.left / jumpX )) * jumpX ) + 'px'; jQuery('#moveBox').animate({left: newXpoint }, 180); jQuery('#moveend').text('>10 +++'); } if ( drogChange < -10 ) { var newXpoint = ( (parseInt(moveBoxoffset.left / jumpX )) * jumpX - jumpX) ; if ( (newXpoint* -1) >= (maxLeft - jumpX) ){ newXpoint = (maxLeft * -1) + jumpX + 'px'; }else { newXpoint = newXpoint + 'px'; } jQuery('#moveBox').animate({left:newXpoint }, 180); jQuery('#moveend').text('<-10 ---'); } if ( drogChange >= -10 && drogChange <= 10 ){ var newXpoint = changeXOld + 'px'; jQuery('#moveBox').animate({left:newXpoint }, 50); } }); </script> </body> </html>
Right on the heels of IE 9’s release, there is already a platform preview for IE 10 (video).
Awesome: Flexbox, Grid, Multi-column, Gradients, (and soon), Transitions and 3D Transforms
Not awesome: No text shadow, No HTML5 Forms support
http://msdn.microsoft.com/en-us/ie/gg192966#_ECMAScript5
link: http://www.devinrolsen.com/basic-jquery-touchmove-event-setup/
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><meta name="viewport" content="width=device-width, user-scalable=no"> <title>Untitled Document</title><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript" ></script><style>.droginfo { width:110px; height:20px; background:#00C;}#someElm {width:110px; height:180px; background:#0bC; position:absolute; top:30px;}
</style></head>
<body><div id="movex"></div><div id="movey"></div>
<div id="someElm"> someElm </div>
<script type="text/javascript">
jQuery('#someElm').bind('touchmove',function(e){
e.preventDefault();
var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
var elm = jQuery(this).offset();
var x = touch.pageX - elm.left;
var y = touch.pageY - elm.top;
if(x < jQuery(this).width() && x > 0){
if(y < jQuery(this).height() && y > 0){
//CODE GOES HERE
//console.log(touch.pageY+' '+touch.pageX);
jQuery('#movex').text(touch.pageX);
jQuery('#movey').text(touch.pageY);
}
}});
</script></body></html>
Vitrum's Blog 
