Skip to main content

Search and Top Navigation

Ticket #4893: test.html
File test.html, 1.7 KB (added by jakobusrex, October 05, 2009 01:01PM UTC)

bug test case

<!DOCTYPE html>
<html>
<head>
	<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />
	<!-- include jquery -->
	<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>

	<!-- include jquery.ui components -->
	<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script>
	<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.resizable.js"></script>
	<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.draggable.js"></script>

	<style type="text/css">
		#resizable { width: 100px; height: 100px; background: silver;  border: 2px dotted black;}
	</style>

	<script type="text/javascript">

	// patch it...
	function applyPatch()
	{
		$.ui.plugin.add("resizable", "isDraggable",
		{
			start: function(event, ui)
			{
				var scroll = ui.element.scrollParent();
				if(scroll)
				{
					ui.originalPosition.top += scroll.scrollTop();
					ui.position.top += scroll.scrollTop();

					ui.originalPosition.left += scroll.scrollLeft();
					ui.position.left += scroll.scrollLeft();
				}
			}
		});
	}

	$(document).ready(function()
	{
		$("#resizable").resizable({ handles: 'all', isDraggable: true});
		$("#resizable").draggable();
	});

	</script>
</head>
<body style="font-size:62.5%;">

<h2>
<a href="#" onclick="applyPatch();"> apply patch! </a>
</h2>

<div id="imgdivholder" style="width:500px; height:500px; overflow:auto; position:relative;" >
	<div id="resizable" style="position: absolute;"></div>
	<img id="image" src = "http://odo.dwds.de/dta2/lachmann/nibelungen/1816/image/40/0009/"/>
</div>

</body>
</html>

Download in other formats:

Original Format