cuteslider/index.html at master · Timer91/cuteslider · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8"/>
	<style>
		body {
			margin: 100px;
			background: #222;
		}
		.cuteSlider {
			display: inline-block;
			width: 150px;
			height: 24px;
		}
	</style>
	<script src="//code.jquery.com/jquery-3.0.0-alpha1.min.js"></script>
	<script src="../jquery-element/jquery-element.js"></script>
	<script src="cuteslider.js"></script>
	<script>
	$(function() {
		$( ".myCuteSlider" ).change( function() {
			console.log( ".myCuteSlider: " + this.value );
		});
		$( "input" ).change( function() {
			console.log( "input: " + this.value );
		});
	});
	</script>
</head>
<body>

<input
	type="range"
	data-jquery-element="cuteSlider"
	data-jquery-element-class="myCuteSlider"
	min="-10" value="0" max="10" step="2"
/>

</body>
</html>