Something

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html lang="en">
<head>
	<script type='text/javascript' src='http://jquery.com/src/jquery-latest.pack.js'></script>
	<script type='text/javascript' src='interface.js'></script>
	<script type='text/javascript'>
		$(document).ready(function(){
		    
		    $('#resize').Resizable({
                minWidth: 50,
            	minHeight: 50,
            	minTop: 5,
            	minLeft: 5,
            	// maxRight: 700, this should be the browsers width
            	// maxBottom: 350, this should be the browsers height
            	handlers: {	se: '#handle' }         				
            });
            		
            $('#resize').Draggable({
                zIndex: 	1000,
                ghosting:	true,
                opacity: 	0.7
            });
			
		});
	</script>
</head>
<body>
    
    <div id='resize' style='background-color: black; color: white; display: block; width: 100px; height: 100px;'>
        HELLO!
        <div id='handle' style="height: 10px; width: 10px; display: block; backround-color: white; float: right; border: 1px solid white;"></div>
    </div>

</body>
</html>