html5画布分层,html5 canvas问题

用canvas能够完全实现 主要代码如下

var canvas=$("#imageCanvas").get(0);

var context=canvas.getContext("2d");

var oldX,oldY,newX,newY;

var enabled=false;

canvas.οnmοusedοwn=function(event){

enabled=true;

oldX = event.clientX;//实际运用中要获取鼠标在元素中的相对位置，在此为了方便直接获取了event的clientX

oldY = event.clientY;//实际运用中要获取鼠标在元素中的相对位置，在此为了方便直接获取了event的clientY

};

canvas.οnmοuseup=function(event) {

enabled = false;

};

canvas.οnmοusemοve=function(event) {

if (!enabled) {

return;

}

newX=event.clientX;//实际运用中要获取鼠标在元素中的相对位置，在此为了方便直接获取了event的clientX

newY=event.clientY;//实际运用中要获取鼠标在元素中的相对位置，在此为了方便直接获取了event的clientY

moveImage();

oldX=newX;

oldY=newY;

};

function moveImage(){

var moveX=(newX - oldX);

var moveY=(newY - oldY);

//图像移动

context.transform(1,0,0,1,moveX,moveY);

context.drawImage(image);

}

具体效果请查看本博客