http://wbex.ru/index.php?action=history&feed=atom&title=JavaScript_DHTML%2FExt_JS%2FSlider
JavaScript DHTML/Ext JS/Slider - История изменений
2026-04-05T22:35:54Z
История изменений этой страницы в вики
MediaWiki 1.30.0
http://wbex.ru/index.php?title=JavaScript_DHTML/Ext_JS/Slider&diff=2376&oldid=prev
в 09:59, 26 мая 2010
2010-05-26T09:59:51Z
<p></p>
<table class="diff diff-contentalign-left" data-mw="interface">
<tr style="vertical-align: top;" lang="ru">
<td colspan="1" style="background-color: white; color:black; text-align: center;">← Предыдущая</td>
<td colspan="1" style="background-color: white; color:black; text-align: center;">Версия 09:59, 26 мая 2010</td>
</tr><tr><td colspan="2" style="text-align: center;" lang="ru"><div class="mw-diff-empty">(нет различий)</div>
</td></tr></table>
http://wbex.ru/index.php?title=JavaScript_DHTML/Ext_JS/Slider&diff=2377&oldid=prev
Admin: 1 версия
2010-05-26T07:21:20Z
<p>1 версия</p>
<p><b>Новая страница</b></p><div>==Horizontal slider==<br />
<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="html4strict"><br />
<br />
<!--<br />
/*!<br />
* Ext JS Library 3.0.0<br />
* Copyright(c) 2006-2009 Ext JS, LLC<br />
* licensing@extjs.ru<br />
* http://www.extjs.ru/license<br />
*/<br />
--><br />
<!-- Revised from demo code in ext3.0.0 --><br />
<html><br />
<head><br />
<title>Hello World Window</title><br />
<link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /><br />
<script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script><br />
<script type="text/javascript" src="ext-3.0.0/ext-all.js"></script><br />
<script type="text/javascript" src="ext-3.0.0/examples/ux/SliderTip.js"></script><br />
<script type="text/javascript"><br />
/*!<br />
* Ext JS Library 3.0.0<br />
* Copyright(c) 2006-2009 Ext JS, LLC<br />
* licensing@extjs.ru<br />
* http://www.extjs.ru/license<br />
*/<br />
Ext.onReady(function(){<br />
new Ext.Slider({<br />
renderTo: "basic-slider",<br />
width: 214,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "increment-slider",<br />
width: 214,<br />
value:50,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "vertical-slider",<br />
height: 214,<br />
vertical: true,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "tip-slider",<br />
width: 214,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: new Ext.ux.SliderTip()<br />
});<br />
var tip = new Ext.ux.SliderTip({<br />
getText: function(slider){<br />
return String.format("<b>{0}% complete</b>", slider.getValue());<br />
}<br />
});<br />
new Ext.Slider({<br />
renderTo: "custom-tip-slider",<br />
width: 214,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: tip<br />
});<br />
new Ext.Slider({<br />
renderTo: "custom-slider",<br />
width: 214,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: new Ext.ux.SliderTip()<br />
});<br />
});<br />
</script><br />
</head><br />
<body><br />
<!-- EXAMPLES --><br />
<h1>Ext Slider Example</h1><br />
<p>Sliders support keyboard adjustments, configurable snapping, axis clicking and animation.</p><br />
<h3>Basic Slider</h3><br />
<div id="basic-slider"></div><br />
<br/><br />
<h3>Snapping Slider</h3><br />
<div id="increment-slider"></div><br />
<br/><br />
<h3>Vertical Slider</h3><br />
<div id="vertical-slider"></div><br />
<br/><br />
<h3>Slider with tip</h3><br />
<div id="tip-slider"></div><br />
<br/><br />
<h3>Slider with custom tip</h3><br />
<div id="custom-tip-slider"></div><br />
<br/><br />
<h3>CSS Customized Slider</h3><br />
<div id="custom-slider"></div><br />
<!-- extra space for scrolling --><br />
<div style="height:150px;"></div><br />
</body><br />
</html><br />
<br />
<br />
</source><br />
<br />
<br />
<br />
<br />
==Snapping slider==<br />
<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="html4strict"><br />
<br />
<!--<br />
/*!<br />
* Ext JS Library 3.0.0<br />
* Copyright(c) 2006-2009 Ext JS, LLC<br />
* licensing@extjs.ru<br />
* http://www.extjs.ru/license<br />
*/<br />
--><br />
<!-- Revised from demo code in ext3.0.0 --><br />
<html><br />
<head><br />
<title>Hello World Window</title><br />
<link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /><br />
<script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script><br />
<script type="text/javascript" src="ext-3.0.0/ext-all.js"></script><br />
<script type="text/javascript" src="ext-3.0.0/examples/ux/SliderTip.js"></script><br />
<script type="text/javascript"><br />
/*!<br />
* Ext JS Library 3.0.0<br />
* Copyright(c) 2006-2009 Ext JS, LLC<br />
* licensing@extjs.ru<br />
* http://www.extjs.ru/license<br />
*/<br />
Ext.onReady(function(){<br />
new Ext.Slider({<br />
renderTo: "basic-slider",<br />
width: 214,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "increment-slider",<br />
width: 214,<br />
value:50,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "vertical-slider",<br />
height: 214,<br />
vertical: true,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "tip-slider",<br />
width: 214,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: new Ext.ux.SliderTip()<br />
});<br />
var tip = new Ext.ux.SliderTip({<br />
getText: function(slider){<br />
return String.format("<b>{0}% complete</b>", slider.getValue());<br />
}<br />
});<br />
new Ext.Slider({<br />
renderTo: "custom-tip-slider",<br />
width: 214,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: tip<br />
});<br />
new Ext.Slider({<br />
renderTo: "custom-slider",<br />
width: 214,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: new Ext.ux.SliderTip()<br />
});<br />
});<br />
</script><br />
</head><br />
<body><br />
<!-- EXAMPLES --><br />
<h1>Ext Slider Example</h1><br />
<p>Sliders support keyboard adjustments, configurable snapping, axis clicking and animation.</p><br />
<h3>Basic Slider</h3><br />
<div id="basic-slider"></div><br />
<br/><br />
<h3>Snapping Slider</h3><br />
<div id="increment-slider"></div><br />
<br/><br />
<h3>Vertical Slider</h3><br />
<div id="vertical-slider"></div><br />
<br/><br />
<h3>Slider with tip</h3><br />
<div id="tip-slider"></div><br />
<br/><br />
<h3>Slider with custom tip</h3><br />
<div id="custom-tip-slider"></div><br />
<br/><br />
<h3>CSS Customized Slider</h3><br />
<div id="custom-slider"></div><br />
<!-- extra space for scrolling --><br />
<div style="height:150px;"></div><br />
</body><br />
</html><br />
<br />
<br />
</source><br />
<br />
<br />
<br />
<br />
==Vertical slider==<br />
<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="html4strict"><br />
<br />
<!--<br />
/*!<br />
* Ext JS Library 3.0.0<br />
* Copyright(c) 2006-2009 Ext JS, LLC<br />
* licensing@extjs.ru<br />
* http://www.extjs.ru/license<br />
*/<br />
--><br />
<!-- Revised from demo code in ext3.0.0 --><br />
<html><br />
<head><br />
<title>Hello World Window</title><br />
<link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /><br />
<script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script><br />
<script type="text/javascript" src="ext-3.0.0/ext-all.js"></script><br />
<script type="text/javascript" src="ext-3.0.0/examples/ux/SliderTip.js"></script><br />
<script type="text/javascript"><br />
/*!<br />
* Ext JS Library 3.0.0<br />
* Copyright(c) 2006-2009 Ext JS, LLC<br />
* licensing@extjs.ru<br />
* http://www.extjs.ru/license<br />
*/<br />
Ext.onReady(function(){<br />
new Ext.Slider({<br />
renderTo: "basic-slider",<br />
width: 214,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "increment-slider",<br />
width: 214,<br />
value:50,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "vertical-slider",<br />
height: 214,<br />
vertical: true,<br />
minValue: 0,<br />
maxValue: 100<br />
});<br />
new Ext.Slider({<br />
renderTo: "tip-slider",<br />
width: 214,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: new Ext.ux.SliderTip()<br />
});<br />
var tip = new Ext.ux.SliderTip({<br />
getText: function(slider){<br />
return String.format("<b>{0}% complete</b>", slider.getValue());<br />
}<br />
});<br />
new Ext.Slider({<br />
renderTo: "custom-tip-slider",<br />
width: 214,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: tip<br />
});<br />
new Ext.Slider({<br />
renderTo: "custom-slider",<br />
width: 214,<br />
increment: 10,<br />
minValue: 0,<br />
maxValue: 100,<br />
plugins: new Ext.ux.SliderTip()<br />
});<br />
});<br />
</script><br />
</head><br />
<body><br />
<!-- EXAMPLES --><br />
<h1>Ext Slider Example</h1><br />
<p>Sliders support keyboard adjustments, configurable snapping, axis clicking and animation.</p><br />
<h3>Basic Slider</h3><br />
<div id="basic-slider"></div><br />
<br/><br />
<h3>Snapping Slider</h3><br />
<div id="increment-slider"></div><br />
<br/><br />
<h3>Vertical Slider</h3><br />
<div id="vertical-slider"></div><br />
<br/><br />
<h3>Slider with tip</h3><br />
<div id="tip-slider"></div><br />
<br/><br />
<h3>Slider with custom tip</h3><br />
<div id="custom-tip-slider"></div><br />
<br/><br />
<h3>CSS Customized Slider</h3><br />
<div id="custom-slider"></div><br />
<!-- extra space for scrolling --><br />
<div style="height:150px;"></div><br />
</body><br />
</html><br />
<br />
<br />
</source></div>
Admin