taffy-coustom-ui
Version:
58 lines (51 loc) • 2.92 kB
HTML
<html lang="en">
<head>
<meta name="keywords" content="jQuery Button, CheckBox, Toggle Button, Repeat Button, Radio Button, Link Button, Button" />
<meta name="description" content="The jqxRepeatButton represents a button widget derived from
the jqxButton. However, jqxRepeatButton give you control over when and how the 'click'
event occurs. The jqxRepeatButton raises the 'click' event repeatedly from the time
it is pressed until it is released." />
<title id='Description'>The jqxRepeatButton represents a button widget derived from
the jqxButton. However, jqxRepeatButton give you control over when and how the 'click'
event occurs. The jqxRepeatButton raises the 'click' event repeatedly from the time
it is pressed until it is released.</title>
<link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1" />
<script type="text/javascript" src="../../../scripts/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="../../../scripts/demos.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxprogressbar.js"></script>
</head>
<body>
<div id='content'>
<script type="text/javascript">
$(document).ready(function () {
// Create a jqxRepeatButton widget.
$("#jqxButton").jqxRepeatButton({ delay: 10, width: '200'});
// Create a jqxProgressBar widget.
$("#jqxProgressBar").jqxProgressBar({ width: '250', height: '25', max: 30});
$("#jqxButton").on('click', function () {
var currentValue = $("#jqxProgressBar").jqxProgressBar('value');
currentValue += 1;
$("#jqxProgressBar").jqxProgressBar({ animationDuration: 0, value: currentValue });
});
});
</script>
<div style='width:250px;' id='jqxWidget'>
<div>
<input style='margin-left: 25px;' type="button" value="Click Me!" id='jqxButton' />
</div>
<div style='margin-top: 10px;'>
<div id='jqxProgressBar'>
</div>
</div>
</div>
</div>
<div style="position: absolute; bottom: 5px; right: 5px;">
<a href="https://www.jqwidgets.com/" alt="https://www.jqwidgets.com/"><img alt="https://www.jqwidgets.com/" title="https://www.jqwidgets.com/" src="https://www.jqwidgets.com/wp-content/design/i/logo-jqwidgets.png"/></a>
</div>
</body>
</html>