拓扑图编辑器(1)

发表于 & 归档在 HTML5, JavaScript, 案例.

拖拽创建节点 拖拽创建节点,以前要实现拖拽,需要监听全局mousemove事件,复制拖拽元素,实现drop效果,现在HTML5提供了新的拖拽事件,处理起来变得很容易 创建连线交互]]>

HTML组件的交互事件设计

发表于 & 归档在 HTML, HTML5, JavaScript, Web.

传统的HTML事件监听方式 通常使用on***对HTML元素添加事件监听,比如

button.onclick = function(evt){
  console.log(evt);
}
很自然的,用户在使用Qunee组件时也会想到这种用法,试图直接在Node上添加onclick监听,结果出现问题,正确的写法应该是这样
graph.onclick = function(evt){
  var element = evt.getData();
  Q.log(element);
}
Qunee拖拽事件过程]]>

famo.us是什么?

发表于 & 归档在 CSS, HTML, JavaScript, Web.

famo.us,被他的动画和交互效果所震撼,研究过其代码后,发现用到三种技术:matrix3d变换,requestAnimationFrame实现动画,以及物理运动引擎,单从技术上看三者都不难实现,但事物表面背后往往隐藏深意,famo.us的由来和目标却是野心勃勃。 famo.us2 ]]>