html 样式列表 divcss5
JavaScript知识结构图
《HTML5移动Web开发实战》完整扫描版电子书+源码
PhoneGap实战(腾讯的资深专家团队撰写,Adobe中国区专家和PhoneGap中国社区联袂推荐)
iOS版PhoneGap原理分析
Query Mobile Data 属性
Html5新标签解释及用法
html标签大全(html5)
ios--网页js调用oc代码+传递参数+避免中文参数乱码的解决方案(实例)
Android中Java和JavaScript交互
IOS UIWebView与Javascript之间的交互 标哥
<input type="button" value="测试log" onclick="activityList({'tytyty':'hehe'})" />
iOS中JavaScript和OC交互
HTML5游戏开发经典教程和案例合集
传智播客HTML5游戏开发视频教程
HTML5、Web引擎与跨平台移动App开发
跨平台移动开发实战(二)------IOS开发环境搭建 --
<a>标签的href和onclick属性
html调用js变量和函数的几个方法
利用Xcode建立PhoneGap应用程序环境 dmg安装PhoneGap,生成模版
如何在IOS平台下搭建PhoneGap开发环境(PhoneGap2.5) 命令build OK
但Phonegap+HTML5不是万能的,不是所有类型的产品都适合,通过自己的实际体验,只有那种交互性不强,以信息获取为主的产品比较适合采用这种 技术路线。关键问题就是,它没有native来得直接,为了跨品台所带来的性能损耗比较大,无法做出交互性很强,非常流畅高效的应用。因此,别奢望用它来 开发很炫的游戏。那些基于HTML5做移动网页游戏的公司,比如UCWeb,做出的东西实在没法和native的游戏相比,限制太多。但用它开发一些信息 类应用或企业级向移动端移植的产品是没问题的。因此,这里谈的技术架构和路线也是基于这样的前提,如果是开发游戏类产品,那应该是另外的景象。
css3
圆角边框 border-radius:25px;
阴影 box-shadow: 10px 10px 5px #888888;
边框图片 border-image:url(border.png) 30 30 round; -moz-border-image:url(border.png) 30 30 round;
背景图片 背景属性 content-box padding-box border-box
文本效果 text-shadow word-wrap:break-word
字体
2D 转换 translate rotate scale skew matrix
3D转换 rotateX rotateY
过渡 transition: width 2s, height 2s, transform 2s;
动画
@keyframes myfirst
{
from {background: red;}
to {background: yellow;}
}
@-moz-keyframes myfirst /* Firefox */
{
from {background: red;}
to {background: yellow;}
}
div
{
animation: myfirst 5s;
-moz-animation: myfirst 5s; /* Firefox */
-webkit-animation: myfirst 5s; /* Safari 和 Chrome */
-o-animation: myfirst 5s; /* Opera */
}
多列
div
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari 和 Chrome */
column-count:3;
}
html5:
html5:
视频 ogg mpeg4 WebM <video src="movie.ogg" controls="controls"></video>
音频 <audio src="song.ogg" controls="controls"> </audio>
拖放
ev.dataTransfer.setData("Text",ev.target.id);
event.preventDefault()
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
画布 <canvas id="myCanvas" width="200" height="100"></canvas>
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.moveTo(10,10);
cxt.lineTo(150,50);
cxt.lineTo(10,50);
cxt.stroke();
svg
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
<polygon points="100,10 40,180 190,60 10,60 160,180"
style="fill:lime;stroke:purple;stroke-5;fill-rule:evenodd;" />
</svg>
地理定位 navigator.geolocation.getCurrentPosition(showPosition);
web存储
localStorage.lastname="Smith";
document.write(localStorage.lastname);
sessionStorage.lastname="Smith";
document.write(sessionStorage.lastname);
应用缓存 <html manifest="demo.appcache">
web workers w=new Worker("demo_workers.js");
服务器发送事件
var source=new EventSource("demo_sse.php");
source.onmessage=function(event)
{
document.getElementById("result").innerHTML+=event.data + "<br />";
};