Why do hoverClass and activeClass properties won't work together ?
- by Dumb Questioner
Why do hoverClass and activeClass properties not work together in the following example ?
<html>
<head>
<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.4.2.js"></script>
<script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.8rc1/ui/jquery-ui.js"></script>
<style type="text/css">
.draggable {width:100px; height:100px; padding-bottom:5px; background-color:#dddddd;}
#dropBox {width:556px; height:400px; }
.sameStylePrecedenceAsDropHoverAndActive {background-color:#ff4490;}
.drop-hover {background-color: #ff8040; }
.drop-active {background-color: #ffffff; }
</style>
<script type="text/javascript">
$(document).ready(function() {
$('.draggable').draggable({
helper: 'clone'
});
$('#dropBox').droppable({
accept: '.draggable',
activeClass: 'drop-active',
hoverClass: 'drop-hover',
drop: function(event, ui) {
alert("Dropped!");
}
});
});
</script>
</head>
<body>
<div id="dropBox" class="sameStylePrecedenceAsDropHoverAndActive"></div>
<div class="draggable">asd</div>
</body>
</html>
