diff options
| author | Richard Worth <rdworth@gmail.com> | 2009-01-30 04:59:41 +0000 |
|---|---|---|
| committer | Richard Worth <rdworth@gmail.com> | 2009-01-30 04:59:41 +0000 |
| commit | 252e24d9d90c5bbefb3bb266f92631a35c935386 (patch) | |
| tree | b9e7d70d5f65b43622c2e0403db765cf39b41731 /tests | |
| parent | 256ea0670aa32054661a2d2f44d1748ea8f9eb97 (diff) | |
| download | jquery-ui-252e24d9d90c5bbefb3bb266f92631a35c935386.tar.gz jquery-ui-252e24d9d90c5bbefb3bb266f92631a35c935386.zip | |
resizable visual tests: added tests for aspectRatio, and combining aspectRatio with min and max height and width options
Diffstat (limited to 'tests')
10 files changed, 264 insertions, 0 deletions
diff --git a/tests/visual/resizable/resizable_option_aspectRatio_0.5.html b/tests/visual/resizable/resizable_option_aspectRatio_0.5.html new file mode 100644 index 000000000..2680856e9 --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_0.5.html @@ -0,0 +1,26 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Resizable option aspectRatio 0.5</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 0.5 + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_1.0.html b/tests/visual/resizable/resizable_option_aspectRatio_1.0.html new file mode 100644 index 000000000..fa380a4cb --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_1.0.html @@ -0,0 +1,26 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Resizable option aspectRatio 1.0</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 1.0 + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_1.5.html b/tests/visual/resizable/resizable_option_aspectRatio_1.5.html new file mode 100644 index 000000000..0dc6d8550 --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_1.5.html @@ -0,0 +1,26 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Resizable option aspectRatio 1.5</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 1.5 + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_preserve_maxHeight_150.html b/tests/visual/resizable/resizable_option_aspectRatio_preserve_maxHeight_150.html new file mode 100644 index 000000000..f4e1ac414 --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_preserve_maxHeight_150.html @@ -0,0 +1,27 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Resizable option aspectRatio 1.0 maxHeight 150</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 'preserve', + maxHeight: 150 + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_preserve_maxWidth_150.html b/tests/visual/resizable/resizable_option_aspectRatio_preserve_maxWidth_150.html new file mode 100644 index 000000000..24ab3de92 --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_preserve_maxWidth_150.html @@ -0,0 +1,27 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Resizable option aspectRatio 1.0 maxWidth 150</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 'preserve', + maxWidth: 150 + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_preserve_minHeight_50.html b/tests/visual/resizable/resizable_option_aspectRatio_preserve_minHeight_50.html new file mode 100644 index 000000000..a598ca1f6 --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_preserve_minHeight_50.html @@ -0,0 +1,27 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Resizable option aspectRatio 1.0 minHeight 50</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 'preserve', + minHeight: 50 + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_preserve_minWidth_50.html b/tests/visual/resizable/resizable_option_aspectRatio_preserve_minWidth_50.html new file mode 100644 index 000000000..8e3ad6ba4 --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_preserve_minWidth_50.html @@ -0,0 +1,27 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Resizable option aspectRatio 1.0 maxWidth 50</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 'preserve', + minWidth: 50 + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_preserve_w100xh100.html b/tests/visual/resizable/resizable_option_aspectRatio_preserve_w100xh100.html new file mode 100644 index 000000000..38458b9c0 --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_preserve_w100xh100.html @@ -0,0 +1,26 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 'preserve' + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_preserve_w100xh50.html b/tests/visual/resizable/resizable_option_aspectRatio_preserve_w100xh50.html new file mode 100644 index 000000000..e206245ff --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_preserve_w100xh50.html @@ -0,0 +1,26 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 'preserve' + }); + }); + </script> + <style type="text/css"> + #resizable { width: 50px; height: 100px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> diff --git a/tests/visual/resizable/resizable_option_aspectRatio_preserve_w50xh100.html b/tests/visual/resizable/resizable_option_aspectRatio_preserve_w50xh100.html new file mode 100644 index 000000000..0615c96bb --- /dev/null +++ b/tests/visual/resizable/resizable_option_aspectRatio_preserve_w50xh100.html @@ -0,0 +1,26 @@ +<!doctype html> +<html lang="en"> +<head> + <title>Resizable Visual Test : Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css" /> + <script type="text/javascript" src="../../../jquery-1.3.1.js"></script> + <script type="text/javascript" src="../../../ui/ui.core.js"></script> + <script type="text/javascript" src="../../../ui/ui.resizable.js"></script> + <script type="text/javascript"> + $(function() { + $("#resizable").resizable({ + aspectRatio: 'preserve' + }); + }); + </script> + <style type="text/css"> + #resizable { width: 100px; height: 50px; background: silver; } + </style> +</head> +<body> + +<div id="resizable">Resizable</div> + +</body> +</html> |