css updates to abstract left, right, bottom, top values into CSS

This commit is contained in:
Scott Jehl 2009-01-29 16:22:13 +00:00
parent e42a055dbb
commit a0d600ccaa
5 changed files with 21 additions and 33 deletions

View File

@ -0,0 +1,18 @@
<!doctype html>
<html>
<head>
<title>Slider Static Test : Default vertical</title>
<link rel="stylesheet" href="../static.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.base.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.theme.css" type="text/css" title="ui-theme" />
<script type="text/javascript" src="../../../jquery-1.3.1.js"></script>
<script type="text/javascript" src="../static.js"></script>
</head>
<body>
<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all">
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 0%;"></a>
</div>
</body>
</html>

View File

@ -11,7 +11,7 @@
<body>
<div id="slider-horizontal-range-max" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-slider-range-max ui-widget-header" style="width:25%; right: 0;"></div>
<div class="ui-slider-range ui-slider-range-max ui-widget-header" style="width:25%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 75%;"></a>
</div>

View File

@ -11,7 +11,7 @@
<body>
<div id="slider-horizontal-range-min" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-slider-range-min ui-widget-header" style="width:25%; left: 0;"></div>
<div class="ui-slider-range ui-slider-range-min ui-widget-header" style="width:25%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 25%;"></a>
</div>

View File

@ -1,30 +0,0 @@
<!doctype html>
<html>
<head>
<title>jQuery UI Slider Static Markup Test Page</title>
<link rel="stylesheet" href="../../../themes/base/ui.base.css" type="text/css" />
<link rel="stylesheet" href="../../../themes/base/ui.theme.css" type="text/css" title="ui-theme" />
<script type="text/javascript" src="../../../jquery-1.3.1.js"></script>
<script type="text/javascript" src="../static.js"></script>
<style type="text/css">
.ui-slider {margin: 2em 0;}
</style>
</head>
<body style="font-size: 62.5%;">
<!-- Slider: horizontal -->
<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 15%;"></a>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 30%;"></a>
<div class="ui-slider-range ui-widget-header" style="left: 15%; width: 15%;"></div>
</div>
<!-- Slider: vertical -->
<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all" style="height: 100px;">
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="top: 15%;"></a>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="top: 60%;"></a>
<div class="ui-slider-range ui-widget-header" style="top: 15%; height: 45%;"></div>
</div>
</body>
</html>

View File

@ -12,7 +12,7 @@
<div id="slider-vertical-range-max" class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all">
<div class="ui-slider-range ui-slider-range-max ui-widget-header" style="height: 75%;"></div>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 75%;"></a>
<a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="bottom: 25%;"></a>
</div>
</body>