Removing css hover effect from a appendChild moved element

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
stsr11
Forum Newbie
Posts: 17
Joined: Thu Jul 15, 2004 6:57 pm

Removing css hover effect from a appendChild moved element

Post by stsr11 »

feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]


I am trying to code a dual list page in js using appendChild to move elements between 2 lists. It works fine, but when I use a CSS hover effect to highlight the <div> to be moved, the hover gets transferred as well. Does any one know how to remove the hover before I append it in JS?

I have 2 <div>s 'left' and 'right' and a simple js function to move children between them:

js:
[syntax="javascript"]function move(id) {
	var left=document.getElementById('left');
	var right=document.getElementById('right');
	var tar=document.getElementById(id);
	if (tar.parentElement.id=='left') {
		// move to right
		right.appendChild(tar);
	} else {
		// move to left
		left.appendChild(tar);
	}
}
css:

Code: Select all

.list:hover { background-color:#CCCCCC; }
my 'children' are simply:

Code: Select all

<div class='list'>item</div>
Thanks
Seppo


feyd | Please use[/syntax]

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Post Reply