2

I'm trying to implement div that follows with cursor and I made simple example of it that uses

$(document).on('mousemove', function(event) {
    $('#pursuer').css({
      top: event.clientY + 10 + 'px',
      left: event.clientX + 10 + 'px',
    });
  });

Full example is here.

But there is the bug - when I moving the cursor the edges of my div get dark. Firstly I was thinking that the problem lay in color with transparency:

background-color: rgba(220, 165, 167, .4);

but changing to hex

background-color: #f0dadb;

didn't help

It there a way to avoid this bad effect?

UPD: I'm using Chrome 42.0.2 / FF 37.0.2 / Opera 29 on windows 8.1. Reproduced in each one. But the most strangest thing is that I really can't reproduce it on OSX (in any browser above). Even more - I can't screenshot the problem in windows because screenshot shows that everything is ok, but actually it isn't

UPD 2: as I noted in comment - I have no any additional plugins and extensions in browsers. Also I can reproduce this issue only on 2 of 3 windows PC (all with windows 8.1 aboard)...trying to find out the differences. Not sure, but looks like the problem in OS.

UPD 3: as advised I did following:

1) removed background, added text, added border (with radius and without radius) - the problem didn't appear

2) removed background, added additional div filler:

<div id='pursuer'>
  <div id='filler'></div>
</div>

with styles

#filler {
  position: relative;

  background-color: #f0dadb;
  border-radius: 35px;
  width: 100%;
  height: 100%;
}

and the problem appeared again. Hence, the cause in background

UPD 4: not only in background-color - if I put an image as a background then I can see the same issue

user1820686
  • 2,008
  • 5
  • 25
  • 44
  • 1
    I don't see that problem, which browser are you using? – Vandervals May 14 '15 at 12:50
  • 1
    Unable to reproduce on OSX chrome and FF – Huangism May 14 '15 at 13:00
  • 1
    I am unable to reproduce the issue on the link using Chrome 42.0.2311.135 m or Firefox 37.0.2 on Windows 8.1. Could it be that you have something affecting the browsers (a toolbar or a plug-in)? – Alvaro Montoro May 14 '15 at 14:35
  • @AlvaroMontoro unfortunately there are no plug-ins for any browser. I have no plug-ins for Opera/FF and turned off all extensions in chrome and got the same problem – user1820686 May 14 '15 at 15:03
  • Have you tried it without any background colour? I would remove all css except for the positioning from it, put some text so you know where the element is and see if it still happens. Hopefully you can get it to a state where it does not happen and figure out exactly what causes it – Huangism May 14 '15 at 15:25
  • Could it only be the actual monitor that is causing the issue? Meaning the moving of the object is leaving a 'dark' trace? Don't know... I cannot reproduce it either ! – eHx May 29 '15 at 15:05

0 Answers0