不止一次在fabric.js中設置defaultCursor

我可以設置canvas.defaultCursor，但是一旦它已經設置，我就無法將它更改爲其他東西。這可能嗎？不止一次在fabric.js中設置defaultCursor

這裏是我的代碼：

var canvas = new fabric.Canvas('c'); 

function setCursor(cursorType) { 
    if (cursorType == 'move') { 
     canvas.defaultCursor = 'move'; 
    } else if (cursorType == 'crosshair') { 
     console.log('Changing cursor to crosshair'); // this works 
     canvas.defaultCursor = 'crosshair'; // this doesn't work 
    } 
} 

setCursor('move'); // this works 

// ... 

setCursor('crosshair');

來源

2015-11-28 Joe Mornin

試着用'canvas.lowerCanvasEl.style.cursor =「crosshair」''''''''''如果什麼都沒有發生，然後用開發工具跟蹤結構並找出爲什麼'setCursor'沒有做正確的事情。許多人使用這樣的圖書館，但從來沒有經過電話，它只是簡單的舊JS和追蹤圖書館將提高理解，並幫助找到這樣的問題的解決方案。 – Blindman67

對我來說，它只是工作。你可以做一個小提琴，它實際上不工作？如果我複製粘貼這個代碼在kitchensink它只是工作正常。 http://fabricjs.com/kitchensink/執行選項卡。 – AndreaBogazzi

事實證明，我的示例代碼是不完整的。

在完整的代碼中，當用戶將鼠標移動到現有畫布對象附近時，我正在更改光標，然後在鼠標移開時將其更改回默認值。

以下是缺失的部分：當用戶將鼠標懸停在對象上時，Fabric使用hoverCursor而不是defaultCursor。在我的情況下，hoverCursor與defaultCursor相同。所以我的代碼確實在應該改變defaultCursor時，但用戶在對象附近移動鼠標時仍然看到原始光標（從hoverCursor）。

我能夠通過在相關對象上更改hoverCursor來解決此問題。

來源

2015-12-01 01:43:14

我看不出有任何問題與變化。看光標在此琴：

http://jsfiddle.net/v1nmtz02/4/

或者試試這裏的片段：

var canvas = new fabric.Canvas('canvas'); 
 
function changeCursor(cursorType) { 
 
    canvas.defaultCursor = cursorType; 
 
}

<script src="http://fabricjs.com/lib/fabric.js"></script> 
 
<button onclick="changeCursor('crosshair');">crosshair</button> 
 
<button onclick="changeCursor('move');">move</button> 
 
<button onclick="changeCursor('default');">default</button> 
 
<canvas id='canvas' width="550" height="550" style="border:#000 1px solid;"></canvas>

來源

2015-11-29 08:19:53 AndreaBogazzi

你是對的。看到我發佈的答案。感謝您抽出寶貴時間，很抱歉地發現您，並感謝偉大的圖書館！ –

不止一次在fabric.js中設置defaultCursor

回答

相關問題