slider list content into CSS

djsns · djsns · commit d398bad064a8 · 2016-08-05T20:49:20.000+02:00
diff --git a/slider/slider.css b/slider/slider.css
@@ -3,4 +3,24 @@ body
 	background-color: #222222;
 	font-size: 24px;
 	color: white;
+}
+
+.slider-list
+{
+	list-style-type: none;
+	padding: 0;
+	margin: 0;
+	counter-reset: slider-list-counter;
+}
+
+.slider-list > *
+{
+	cursor: pointer;
+	display: inline-block;
+}
+
+.slider-list > *::before
+{
+	counter-increment: slider-list-counter;
+	content: "[ " counter(slider-list-counter) " ]";
 }
diff --git a/slider/slider.html b/slider/slider.html
@@ -6,11 +6,13 @@
 	</head>
 	<body onload="zmienslajd()">
 	
-		<span onclick="ustawslajd(1)" style="cursor:pointer;">[ 1 ]</span>
-		<span onclick="ustawslajd(2)" style="cursor:pointer;">[ 2 ]</span>
-		<span onclick="ustawslajd(3)" style="cursor:pointer;">[ 3 ]</span>
-		<span onclick="ustawslajd(4)" style="cursor:pointer;">[ 4 ]</span>
-		<span onclick="ustawslajd(5)" style="cursor:pointer;">[ 5 ]</span>
+		<ol class="slider-list">
+			<li onclick="ustawslajd(1)"></li>
+			<li onclick="ustawslajd(2)"></li>
+			<li onclick="ustawslajd(3)"></li>
+			<li onclick="ustawslajd(4)"></li>
+			<li onclick="ustawslajd(5)"></li>
+		</ol>
 		
 		<div id="slider"></div>
 		
