IE7, droppable doesn't work.

[flasht]

Draggable does work, but droppable not. It does only revery when dropped, doesn't hover-highlight, neither.

<img class="p2i" name="p2" src="..." />
<div class="p2c" name="p2"></div>

<script>
	$('img[name="p2"]').draggable({
			start: function(e,ui){$(this).hide().fadeIn()},
			revert: true, zIndex: 999,tolerance: 'pointer',
			cursorAt: {left: -10, top: -18}
	});

$('div[name="p2"]').droppable( {
		accept: 'img[name="p2"]',
		hoverClass: 'p2h',
		tolerance: 'pointer',
		drop: function(e,ui){
			ui.draggable.fadeOut();
			$(this).droppable( 'destroy' );
			$(this).fadeOut(500,function(){$(this).css({'background-image' : 'url(' + ui.draggable.attr('src') + ')', 'border' : 'solid 1px #ddd'}).fadeIn()});
		}
	});
</script>

[Scott González]

This is unrelated to jQuery UI. IE is confused by the duplicate names and the selector isn't finding the div.

[flasht]

First of all, HTML secs says that name does not have to be unique, and second thing is that when its:

<img class="p2i" name="p2" src="..." />
<img class="p2i" name="p2" src="..." />
<img class="p2i" name="p2" src="..." />
<img class="p2i" name="p2" src="..." />
<img class="p2i" name="p2" src="..." />

<div class="p2c" name="p2"></div>
<div class="p2c" name="p2"></div>
<div class="p2c" name="p2"></div>
<div class="p2c" name="p2"></div>
<div class="p2c" name="p2"></div>

All image events are being applied, and non of div events do. So it is NOT the problem of selecting things with same name.