html проблема разрешения холста с наложением полей - PullRequest
Новая
       17

html проблема разрешения холста с наложением полей

0 голосов
/ 22 марта 2011

Я заметил проблемы с прорисовкой одной рамки над другой. По запросу, вот код, но более подробно 

function draw(x,y,w,h,c){
 ctx.fillStyle=c;
 ctx.strokeStyle=c;
 ctx.lineWidth=1;
 ctx.globalAlpha=1.0;
 ctx.fillRect(x,y,w,h);
}

function Rectangle(x,y,w,h,c){
 this.x=x;
 this.y=y;
 this.w=w;
 this.h=h;
 this.c=c;
 this.draw=draw;

 this.onMouseEnter=function(){
  this.c='rgb(0,0,0)';   //black
  this.draw();
 }

this.onMouseLeave=function(){
 this.c='rgb(255,255,255)';   //white
 this.draw();
 }
}
box=new Rectangle(10,10,110,110,'rgb(255,255,255)');  //black box at

В состоянии покоя коробка белая, но при наведении она становится черной. Тем не менее, все еще есть белая граница. Я почти уверен, что это не ошибка с моей стороны, так как я меняю цвет, а не размеры. Я также заметил эту проблему, возникающую в большинстве других моих функций onHover.

Почему у HTML такие проблемы при рисовании поверх других объектов.

Спасибо

1 Ответ

1 голос
/ 22 марта 2011

Это часто может произойти, если вы создаете прямоугольник со значениями не-int. Смотри http://jsfiddle.net/cwolves/9tZTy/

Если вы измените числа на нецелые числа (например, 25.5), вы увидите, что у окна есть красное "свечение" вокруг него, когда вы нажмете на холст.

Простое решение - указать каждое значение, которое вы передаете fillRect: 

ctx.fillRect(x1 << 0, y1 << 0, x2 << 0, y2 << 0);

[править]

Кажется, в вашем примере используются целые числа, поэтому, если вы все еще видите проблему в моей демонстрации, сначала вызовите clearRect ().

...