Background redraw problem when moving HTML elements

Hi

I want to setup an interface with dragable 'windowlike' div layers.
If the object is dragged the onmousemove event changes the style.left and the style.top properties of the div element.

All goes well except for the fact that internet explorer continuesly redraws (and reloads!) the background image of any html element that is moved.
This is very annoying as it renders the drag-effect quite useless.
If the element has no background image, all goes well.
Also on browsers like Mozilla/firefox or opera this behaviour does not occor.

I've put up an example on  http://www.steffest.com/dragtest.htm
The box on the left has no background image and displays well while dragging
The box on the right has a background image and flickers badly while dragging in internet explorer.

Anyone an idea how to prevent those background image redraws?

Thanks,
Steffest
LVL 1
SteffestAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

robotman757Commented:
Maybe its me this morning, but I can't get either one of them to drag at all!!
0
SteffestAuthor Commented:
Hi,
Lucky it's early afternoon here :-)

You can drag the boxes with the blue title bar, not with the windowcontent itself.
Should work on all modern browsers, if not, what browser are you using ?

Steffest
0
_aaron_Commented:
If you notice, not all of the images are redrawn...

When you have the img as a separate element within the row, it is not redrawn, and is correctly moved ( without redraw )...

The solution ( which you probably wont like ) is to not use background images, and instead, only use img elements within the row:

ie ... <td><img src=...></img></td>

and NOT

      <td background="...."></td>


-- Aaron
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.