Question

查看工作小提琴。如果按住左键并开始拖动鼠标，则笔刷标记从鼠标指针的尖端开始。

但在我试过的'新'小提琴中，画笔标记从指针尖端下方的某处开始。

如何解决此问题。

HTML：

<div>
    <div id="content">
        <img src="http://www.lynnecalder.com/house_clipart.gif">                 
    </div>
</div>

JS：

$(document).ready(function () {
    var body = $('body');
    body.css({
        'position': 'relative',
        'top': '70px'
   }).append('<div id="MarkerTools"></div><canvas id="simple_sketch"></canvas>');
    $('#simple_sketch').sketch();
})

CSS：

* {
    margin: 0;
    padding: 0;
}
#MarkerTools {
    width: 100%;
    height: 50px;
    position: fixed;
    top: 0;
    background: #2b539a;
}
#simple_sketch {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left:0;
    border:1px solid green;
}

Answer 1

它与画布和高度/宽度样式有关。你最好使用这个属性。将你的js改为：

$(document).ready(function () {
    var body = $('body'), height = 200, width = 200; # You can calculate height and width here. DONT USE % or em for a canvas!!!.
    body.css({
        'position': 'relative',
        'top': '70px'
    }).append('<div id="MarkerTools"></div><canvas id="simple_sketch" height=' + height + ' width=' + width + '></canvas>');
    $('#simple_sketch').sketch();
})

http://jsfiddle.net/g3sTL/230/

Sketch.js - 画笔从鼠标指针下方开始

1 个答案: