Improving visual testcase for position. Partial fix for #5284 - Position: Smarter collision detection

This commit is contained in:
jzaefferer 2010-07-30 11:33:49 +02:00
parent 61e0aeac7e
commit 3f45f5ccf9

View File

@ -13,27 +13,29 @@
<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
var ul = $("ul"); var inputs = $("input");
$("input").each(function() { $("ul").insertAfter(inputs);
$(this).position({ $(window).resize(function() {
my: this.id.replace(/-/, " "), inputs.each(function() {
at: this.id.replace(/-/, " "), $(this).position({
of: "#container", my: this.id.replace(/-/, " "),
collision: "none" at: this.id.replace(/-/, " "),
of: "#container",
collision: "none"
});
$(this).next().menu().position({
my: "left top",
at: "left bottom",
of: this
});
}); });
ul.clone().insertAfter(this).menu().position({ }).resize();
my: "left top",
at: "left bottom",
of: this
});
});
ul.remove();
}); });
</script> </script>
<style> <style>
input, .ui-menu { position: absolute; } input, .ui-menu { position: absolute; }
.ui-menu { width: 200px; } .ui-menu { width: 200px; }
html, body { width: 100%; height: 100% } html, body { width: 99%; height: 99% }
#container { width: 95%; height: 95%; border: 1px solid black; margin: auto; } #container { width: 95%; height: 95%; border: 1px solid black; margin: auto; }
</style> </style>
</head> </head>