放大后圖片和canvas不再一個位置的原因是因為之前的canvas設置的寬高為固定的800*600,所以要解決偏移的問題也就2點。1、判斷:當window.innerWidth < 992 的時候,設置blur-div和blur-image的寬高為800*600,同時將canvasWidth和canvasHeight也設置為800、600。2、判斷:當window.innerWidth < 992 的時候,context.drawImage(image,0,0,800,600);不過這個時候還要注意initCanvas和show這兩個函數(shù)對于drawImage在Width<992時的關系
2016-11-07
解決bug:
在reset方法里加一個條件限制一下就ok了
function reset() {
if(clippingRegion.r>1000||clippingRegion.r==radius){
initCanvas();
}
}
在reset方法里加一個條件限制一下就ok了
function reset() {
if(clippingRegion.r>1000||clippingRegion.r==radius){
initCanvas();
}
}
最新回答 / nc1199
去了解下drawimage更詳細的API后你就會完全了解canvas的繪圖機制了~或者你看看這個視頻http://idcbgp.cn/learn/338 里面就有清楚的講解~
2016-10-26
有偏移量是因為圖片的寬或高小于Canvas的寬或高,老師代碼變量取反寫錯了(沒有考慮到topMargin可能是負數(shù)),數(shù)值類型前面直接加負號即可,可比較:
alert(-topMargin);alert("-"+topMargin);
alert(-topMargin);alert("-"+topMargin);
2016-10-19