91 lines
2.9 KiB
HTML
Executable File
91 lines
2.9 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<title>jQuery Wan Spinner Plugin Demos</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" type="text/css" href="../build/wan-spinner.css">
|
|
<link href="http://www.jqueryscript.net/css/jquerysctipttop.css" rel="stylesheet" type="text/css">
|
|
<link href='http://fonts.googleapis.com/css?family=Roboto+Condensed' rel='stylesheet' type='text/css'>
|
|
<style>
|
|
body { background-color:#ECF0F1; font-family:'Roboto Condensed';}
|
|
.container { margin:150px auto; text-align:center; max-width:640px;}
|
|
h1 { margin-bottom:50px;}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="jquery-script-menu">
|
|
<div class="jquery-script-center">
|
|
<ul>
|
|
<li><a href="http://www.jqueryscript.net/form/Minimal-Number-Picker-Plugin-For-jQuery-Wan-Spinner.html">Download This Plugin</a></li>
|
|
<li><a href="http://www.jqueryscript.net/">Back To jQueryScript.Net</a></li>
|
|
</ul>
|
|
<div class="jquery-script-ads"><script type="text/javascript"><!--
|
|
google_ad_client = "ca-pub-2783044520727903";
|
|
/* jQuery_demo */
|
|
google_ad_slot = "2780937993";
|
|
google_ad_width = 728;
|
|
google_ad_height = 90;
|
|
//-->
|
|
</script>
|
|
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
|
|
</script></div>
|
|
<div class="jquery-script-clear"></div>
|
|
</div>
|
|
</div>
|
|
<div class="container">
|
|
<h1>jQuery Wan Spinner Plugin Demos</h1>
|
|
<div class="wan-spinner wan-spinner-1">
|
|
<a href="javascript:void(0)" class="minus">-</a>
|
|
<input type="text" value="1">
|
|
<a href="javascript:void(0)" class="plus">+</a>
|
|
</div><br>
|
|
|
|
<br/>
|
|
<div class="wan-spinner wan-spinner-2">
|
|
<a href="javascript:void(0)" class="minus">-</a>
|
|
<input type="text" value="1">
|
|
<a href="javascript:void(0)" class="plus">+</a>
|
|
</div><br>
|
|
<br>
|
|
<div class="wan-spinner wan-spinner-3">
|
|
<a href="javascript:void(0)" class="minus">-</a>
|
|
<input type="text" value="1">
|
|
<a href="javascript:void(0)" class="plus">+</a>
|
|
</div>
|
|
<script src="../../jquery-1.12.4.js"></script>
|
|
<script type="text/javascript" src="../build/wan-spinner.js"></script>
|
|
<script type="text/javascript">
|
|
$(document).ready(function() {
|
|
var options = {
|
|
maxValue: 10,
|
|
minValue: -5,
|
|
step: 0.1,
|
|
inputWidth: 100,
|
|
start: -2,
|
|
plusClick: function(val) {
|
|
console.log(val);
|
|
},
|
|
minusClick: function(val) {
|
|
console.log(val);
|
|
},
|
|
exceptionFun: function(val) {
|
|
console.log("excep: " + val);
|
|
},
|
|
valueChanged: function(val) {
|
|
console.log('change: ' + val);
|
|
}
|
|
}
|
|
$(".wan-spinner-1").WanSpinner(options);
|
|
$(".wan-spinner-2").WanSpinner().css("border-color", "#2C3E50");
|
|
$(".wan-spinner-3").WanSpinner({inputWidth: 100}).css("border-color", "#C0392B");
|
|
});
|
|
</script>
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|