mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-10-20 20:44:21 +00:00
3576ceb360
This adds a compound test page for draggable+resizable, which had no coverage before. Using that page shows that there is no way to reproduce the behaviour described in the original ticket that caused this workaround, since its not possible to resize an element beyond the window boundaries. Therefore removing the workaround, which is 6+ years old and has no test coverage, seems like the sanest approach. Fixes #6939 Closes gh-1210
52 lines
1.4 KiB
HTML
52 lines
1.4 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Compound Visual Test: Draggable and Resizable block element</title>
|
|
<link rel="stylesheet" href="../visual.css">
|
|
<link rel="stylesheet" href="../../../themes/base/all.css">
|
|
<script src="../../../jquery.js"></script>
|
|
<script src="../../../ui/core.js"></script>
|
|
<script src="../../../ui/widget.js"></script>
|
|
<script src="../../../ui/mouse.js"></script>
|
|
<script src="../../../ui/draggable.js"></script>
|
|
<script src="../../../ui/resizable.js"></script>
|
|
<style>
|
|
.draggable {
|
|
margin: 0.5em;
|
|
padding: 0.5em;
|
|
}
|
|
.absolute {
|
|
color: red;
|
|
position: absolute !important;
|
|
}
|
|
</style>
|
|
<script>
|
|
$(function() {
|
|
$( ".draggable" )
|
|
.addClass( "ui-widget ui-widget-header ui-corner-all" )
|
|
.draggable({
|
|
revert: "invalid"
|
|
})
|
|
.resizable({
|
|
minHeight: 13,
|
|
handles: "s"
|
|
});
|
|
$( ".draggable:last" ).addClass( "absolute" );
|
|
});
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<p>WHAT: Three draggable and resizable elements, with only a bottom handle. Last one (red color) is absolutely positioned.</p>
|
|
<p>EXPECTED: Each element can be dragged and resized. The first two stay with their relative positioning (induced by draggable). The last one can be resized despite the absolute positioning.</p>
|
|
|
|
<div id="first">
|
|
<div class="draggable">Draggable 1-1</div>
|
|
<div class="draggable">Draggable 1-2</div>
|
|
<div class="draggable">Draggable 1-3</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|