МГОУ

Обучение онлайн!

– Цвет –
Красная кисть
Зеленая кисть
Синяя кисть
– Толщина –
Тонкая кисть
Нормальная кисть
Толстая кисть
– Операции-


Щелкните правой кнопкой мыши для сохранения …

var previousColorElement;

function changeColor(color, imgElement)
{
// Меняем текущий цвет рисования
context.strokeStyle = color;

// Меняем стиль элемента , по которому щелкнули
imgElement.className = “Selected”;

// Возвращаем ранее выбранный элемент в нормальное состояние
if (previousColorElement != null)
previousColorElement.className = “”;

previousColorElement = imgElement;
}
// Отслеживаем элемент для толщины линии, по которому ранее щелкнули
var previousThicknessElement;

function changeThickness (thickness, imgElement)
{
// Изменяем текущую толщину линии
context.lineWidth = thickness;

// Меняем стиль элемента , по которому щелкнули
imgElement.className = “Selected”;

// Возвращаем ранее выбранный элемент в нормальное состояние
if (previousThicknessElement != null)
previousThicknessElement.className = “”;

previousThicknessElement = imgElement;
}
function startDrawing(e) {
// Начинаем рисовать
isDrawing = true;

// Создаем новый путь (с текущим цветом и толщиной линии)
context.beginPath();

// Нажатием левой кнопки мыши помещаем “кисть” на холст
context.moveTo(e.pageX – canvas.offsetLeft, e.pageY – canvas.offsetTop);
}