Skip to content
This repository was archived by the owner on May 25, 2019. It is now read-only.

Commit b69562d

Browse files
johnparnjohnparn
committed
Assigned examples to list and added anchors.
1 parent 4c84697 commit b69562d

File tree

1 file changed

+41
-27
lines changed

1 file changed

+41
-27
lines changed

‎demo/demo.html‎

Lines changed: 41 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,9 @@
1515
padding: 1em;
1616
background-color: #FFE;
1717
}
18+
li {
19+
list-style-position: inside;
20+
}
1821
.sliderExample {
1922
width: 640px;
2023
padding: 2em;
@@ -45,13 +48,16 @@
4548
<body ng-controller="sliderDemoCtrl">
4649

4750
<h1>AngularUI Slider demo</h1>
48-
<div class="sliderExample">
51+
<ol>
52+
<li>
53+
<div class="sliderExample"><a name="ex1"></a>
4954
<strong>Step slider with event listeners (see console log)</strong>
5055
<div ui-slider min="0" max="50" ng-model="demoVals.sliderExample1"></div>
5156
<input type="text" ng-model="demoVals.sliderExample1" />
5257
</div>
53-
54-
<div class="sliderExample">
58+
</li>
59+
<li>
60+
<div class="sliderExample"><a name="ex2"></a>
5561
<div>
5662
<strong>Slider - vertical, step value 5</strong>
5763
</div>
@@ -74,62 +80,69 @@ <h1>AngularUI Slider demo</h1>
7480
<input type="text" ng-model="demoVals.sliderExample2" />
7581
</div>
7682
</div>
77-
78-
<div class="sliderExample">
83+
</li>
84+
<li>
85+
<div class="sliderExample"><a name="ex3"></a>
7986
<strong>Slider - start value 14</strong>
8087
<div ui-slider min="0" max="20" ng-model="demoVals.sliderExample3"></div>
8188
<input type="text" ng-model="demoVals.sliderExample3" />
8289
</div>
83-
84-
<div class="sliderExample">
90+
</li>
91+
<li>
92+
<div class="sliderExample"><a name="ex4"></a>
8593
<strong>Dual sliders - start value 14</strong>
8694
<div ui-slider min="0" max="20" ng-model="demoVals.sliderExample4"></div>
8795
<div ui-slider min="0" max="20" ng-model="demoVals.sliderExample4"></div>
8896
<input type="text" ng-model="demoVals.sliderExample4" />
8997
</div>
90-
91-
<div class="sliderExample">
98+
</li>
99+
<li>
100+
<div class="sliderExample"><a name="ex5"></a>
92101
<strong>Slider - default min and max</strong>
93102
<div ui-slider ng-model="demoVals.sliderExample5"></div>
94103
<input type="text" ng-model="demoVals.sliderExample5" />
95104
</div>
96-
97-
<div class="sliderExample">
105+
</li>
106+
<li>
107+
<div class="sliderExample"><a name="ex6"></a>
98108
<strong>Slider - range max (instead of min)</strong>
99109
<div ui-slider="{range: 'max'}" ng-model="demoVals.sliderExample6"></div>
100110
<input type="text" ng-model="demoVals.sliderExample6" />
101111
</div>
102-
103-
<h2>Examples with decimals</h2>
104-
105-
<div class="sliderExample">
112+
</li>
113+
<li>
114+
<div class="sliderExample"><a name="ex7"></a>
106115
<strong>Slider - range values, step with decimals</strong>
107116
<div ui-slider="{range: true}" min="0" max="100" step="0.01" use-decimals ng-model="demoVals.sliderExample7"></div>
108117
<input type="text" ng-model="demoVals.sliderExample7" />
109118
</div>
110-
111-
<div class="sliderExample">
119+
</li>
120+
<li>
121+
<div class="sliderExample"><a name="ex8"></a>
112122
<strong>Slider - start value 0.34, step with decimals (try increase/decrease with arrow keys)</strong>
113123
<div ui-slider min="0.00" max="2.00" step="0.01" use-decimals ng-model="demoVals.sliderExample8"></div>
114124
<div ui-slider min="0.00" max="2.00" step="0.01" use-decimals ng-model="demoVals.sliderExample8"></div>
115125
<input type="text" ng-model="demoVals.sliderExample8" />
116126
</div>
117-
118-
<div class="sliderExample">
127+
</li>
128+
<li>
129+
<div class="sliderExample"><a name="ex9"></a>
119130
<strong>Slider - start value [-0.52, 0.54], step with decimals from min -1.00 to max 1.00 (try increase/decrease with arrow keys)</strong>
120131
<div ui-slider="{range: true}" min="-1.00" max="1.00" step="0.01" use-decimals ng-model="demoVals.sliderExample9"></div>
121132
<div ui-slider="{range: true}" min="-1.00" max="1.00" step="0.01" use-decimals ng-model="demoVals.sliderExample9"></div>
122133
<input type="text" ng-model="demoVals.sliderExample9" />
123134
</div>
124-
125-
<div class="sliderExample">
135+
</li>
136+
<li>
137+
<div class="sliderExample">><a name="ex10"></a>
126138
<strong>Slider - start value -0.37, step with decimals from min -1.00 to max 1.00</strong>
127139
<div ui-slider min="-1.00" max="1.00" step="0.01" use-decimals ng-model="demoVals.sliderExample10"></div>
128140
<div ui-slider min="-1.00" max="1.00" step="0.01" use-decimals ng-model="demoVals.sliderExample10"></div>
129141
<input type="text" ng-model="demoVals.sliderExample10" />
130142
</div>
131-
132-
<div class="sliderExample">
143+
</li>
144+
<li>
145+
<div class="sliderExample"><a name="ex11"></a>
133146
<strong>Simple <a href="http://jqueryui.com/slider/#colorpicker">Colorpicker</a></strong>
134147
<div id="red" ui-slider="colorpicker.options" ng-model="colorpicker.red"></div>
135148
Red: <input ng-model="colorpicker.red">
@@ -139,8 +152,9 @@ <h2>Examples with decimals</h2>
139152
Blue: <input ng-model="colorpicker.blue">
140153
<div id="swatch"></div>
141154
</div>
142-
143-
<div class="sliderExample">
155+
</li>
156+
<li>
157+
<div class="sliderExample"><a name="ex12"></a>
144158
<strong>Step slider with event listeners(see console log)</strong>
145159
<div ui-slider="slider.options" min="0" max="50" ng-model="demoVals.sliderExample1"></div>
146160
<input type="text" ng-model="demoVals.sliderExample1" />
@@ -173,8 +187,8 @@ <h2>Examples with decimals</h2>
173187
});
174188
</pre>
175189
</div>
176-
177-
190+
</li>
191+
</ol>
178192
<script type="text/javascript" src="bower_components/jquery/jquery.min.js"></script>
179193
<script type="text/javascript" src="bower_components/jquery-ui/ui/minified/jquery-ui.min.js"></script>
180194
<script type="text/javascript" src="bower_components/angular/angular.min.js"></script>

0 commit comments

Comments
 (0)