|
animationDuration
|
number
|
300
|
Sets or gets the animationDuration property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50,animationDuration:1000, theme: "light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
colorRanges
|
array
|
[]
|
Sets or gets the colorRanges property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, colorRanges: "colorRanges", theme:"light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
disabled
|
boolean
|
false
|
Sets or gets the disabled property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50,disabled:true, theme: "light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
height
|
number
|
null
|
Sets or gets the height property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
layout
|
string
|
"normal"
|
Sets or gets the layout property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light", layout:"reverse" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
max
|
number
|
100
|
Sets or gets the max property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light",max:250 } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
min
|
number
|
0
|
Sets or gets the min property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light",min:30 } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
orientation
|
string
|
'horizontal'
|
Sets or gets the orientation property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light", orientation:"vertical" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
rtl
|
boolean
|
false
|
Sets or gets the rtl property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light",rtl:true } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
renderText
|
object
|
null
|
Sets or gets the renderText property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light", renderText:"renderText" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
showText
|
boolean
|
false
|
Sets or gets the showText property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
template
|
string
|
'default'
|
Sets or gets the template property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
theme
|
string
|
''
|
Sets or gets the theme property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
value
|
number
|
0
|
Sets or gets the value property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
width
|
number
|
null
|
Sets or gets the width property.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
|
|
complete
|
Event
|
|
Code examples
Bind to the complete event of jqxProgressBar.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } window.onload = function() { document.querySelector( "jqx-progress-bar").addEventListener("complete", function(event) { // Your code here. }); }; </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
invalidvalue
|
Event
|
|
Code examples
Bind to the invalidvalue event of jqxProgressBar.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } window.onload = function() { document.querySelector( "jqx-progress-bar").addEventListener("invalidvalue", function(event) { // Your code here. }); }; </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
valueChanged
|
Event
|
|
Code examples
Bind to the valueChanged event of jqxProgressBar.
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } window.onload = function() { document.querySelector( "jqx-progress-bar").addEventListener("valueChanged", function(event) { // Your code here. }); }; </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
|
|
actualValue
|
Method
|
|
| Parameter |
Type |
Description |
| value |
number |
|
Return Value
void
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } window.onload = function() { document.querySelector( "jqx-progress-bar").actualValue(20,20); } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
destroy
|
Method
|
|
| Parameter |
Type |
Description |
| None |
|
|
Return Value
void
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } window.onload = function() { document.querySelector( "jqx-progress-bar").destroy(); } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
|
val
|
Method
|
|
| Parameter |
Type |
Description |
| value |
number |
|
Return Value
Number
<!DOCTYPE html><html lang="en"><head> <title id='Description'>Progressbar Custom Element Settings</title> <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" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" /> <link rel="stylesheet" href="../jqwidgets/styles/jqx.light.css" type="text/css" /> <link rel="stylesheet" href="../styles/demos.css" type="text/css" /> <script type="text/javascript" src="../scripts/webcomponents-lite.min.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../jqwidgets/jqxcore.elements.js"></script> <script type="text/javascript" src="../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../jqwidgets/jqxprogressbar.js"></script> <script> JQXElements.settings[ "progressBarSettings"] = { value:50, theme: "light" } window.onload = function() { var result = document.querySelector( "jqx-progress-bar").val(); } </script></head><body> <jqx-progress-bar settings="progressBarSettings"></jqx-progress-bar>
|
