我的光标图像正在保存128px x 128px pngs,但现在它们不在任何浏览器中:(做了一些改变?我几天前发布了一个问题,关于我的光标图像没有因为我的绘图的onclick而改变应用程序。我帮助解决了我的初始问题,你可以看到它在控制台中被正确调用,一切都很好,但图像不会从画笔图像中改变。我认为它可能与尺寸有关但是我不是百分百肯定。非常感谢任何帮助:
*************** HTML **********
<div class="tools">
<table>
<tr>
<th>
<div id="brush">
<input type="image" class="line" src="./assets/tools/brush.png" />
</div>
</th>
<th>
<div id="bucket">
<input type="image" class="line" src="./assets/tools/bucket.png" onclick="setFill()" />
</div>
</th>
<th>
<div id="eraser">
<input type="image" class="line" src="./assets/tools/eraser.png" onclick="setEraser()" />
</div>
</th>
<th>
<div>
<form onsubmit='return false;'>
<input type='image' src="./assets/tools/clear_brush.png" class="line" id="clear" onclick='clear_canvas_rectangle ()'>
</form>
</div>
</th>
</tr>
</table>
</div>
************************** JS ******************** ***********
$('.tools table tr th div').each(function() {
$(this).click(function () {
console.log($(this).attr('id
setCursor($(this).attr('id'));
});
});
function setCursor(id) {
console.log("init.jsCursor(): id: " + id);
switch (id) {
case 'brush':
shape = SHAPE_TYPE.LINE;
break;
case 'eraser':
shape = SHAPE_TYPE.ERASER;
break;
case 'fill':
shape = SHAPE_TYPE.FILL;
break;
}
console.log("image: " + 'cursor_' + id + '.png');
$('.canvas-boards').css('cursor', 'url(../assets/tools/cursor_' + id + '.png)0 130, auto');
$('.canvas-boards').css('cursor', 'url(../assets/tools/cursor_brush.png) 0 130, auto');
}
function setLine(){
console.log('init.jstLine(): brush');
shape = SHAPE_TYPE.LINE;
$('.canvas-boards').css('cursor', 'url(../assets/tools/cursor_brush.png)0 130, auto');
}
function setEraser(){
console.log('init.jstEraser(): eraser');
shape = SHAPE_TYPE.ERASER;
$('.canvas-boards').css('cursor', 'url(../assets/tools/cursor_eraser.png)0 130, auto');
}
function setFill(){
shape = SHAPE_TYPE.FILL;
$('.canvas-boards').css('cursor', 'url(../assets/tools/cursor_bucket.png)30 120, auto');
}