提问人：UnkwnTech 提问时间：10/6/2008 最后编辑：T.ToduaUnkwnTech 更新时间：7/3/2014 访问量：101450
有一个简单的 JavaScript 滑块吗？[关闭]
Is there a simple JavaScript slider? [closed]
问：
就目前而言，这个问题并不适合我们的问答形式。我们希望答案得到事实、参考资料或专业知识的支持，但这个问题可能会引发辩论、争论、民意调查或扩展讨论。如果您认为此问题可以改进并可能重新打开，请访问帮助中心获取指导。
10年前关闭。
我需要为 WMP 对象创建自定义音量滑块。当前的滑块修改和使用起来很复杂，有没有一种简单的方法可以在 HTML 页面上生成一个滑块，可以将其值传递给 javascript 函数？
答：
30赞
John Millikin
10/6/2008
#1
评论
5赞
Ehtesh Choudhury
2/23/2013
如果没有额外的 jquery-touch-punch 库，在移动设备上就不能很好地工作。这也与 Twitter Bootstrap 相冲突，所以要小心。$.fn.button
4赞
pkaeding
10/6/2008
#2
script.aculo.us 有一个滑块控件，可能值得一试。
2赞
Ates Goral
10/6/2008
#3
轻量级的MooTools框架有一个： http://demos.mootools.net/Slider
5赞
Alex Gyoshev
10/6/2008
#4
20赞
olle
10/6/2008
#5
带有 Webforms 2 的 HTML 5 提供了一个可以使浏览器为您生成本机滑块。不幸的是，所有浏览器都不支持此功能，但是 google 已经使用 js 实现了所有 Webforms 2 控件。IIRC js 足够智能，可以知道浏览器是否实现了控件，并且仅在没有本机实现时才会触发。<input type="range">
从我的角度来看，应尽可能使用浏览器本机控件作为最佳实践。
1赞
unigg
12/11/2009
#6
这是一个易于使用的简单滑块对象
1赞
Tom
3/31/2010
#7
Carpe Slider 也有更新的版本：
v1.5 carpe_ambiprospect_slider v2.0b ...滑块/草稿/v2.0/
6赞
treznik
4/8/2010
#8
这是另一个轻量级的 JavaScript 滑块，似乎适合您的需求。
评论
0赞
Cybernetic
3/11/2023
此链接已断开
2赞
Farm
11/2/2011
#9
我推荐Filament Group的Slider，它有非常好的用户体验
35赞
Luc
12/5/2011
#10
嘿，我刚刚创建了自己的 JS 滑块，因为我受够了沉重的 Jquery UI 滑块。有兴趣听听人们的想法。已经上了 5 个小时，所以真的非常非常早期。
评论
0赞
Dave Everitt
7/5/2012
很好的例子 - 我正在寻找一个控件来淡化一个图像的不透明度，所以可以尝试这个。
0赞
Michael Wasser
10/19/2012
谢谢你的这个例子 -- 缺少不属于某个更大库的简单滑块控件真的很烦人。这促使我尝试写出满足我需求的自己的作品
0赞
Xavi Esteve
10/29/2012
对于那些想知道的人：WinXP/IE7 工作得很好，WinXP/IE6 工作但需要 CSS 调整，iOS5/Safari 不起作用（猜猜其他触摸设备也不会）。对于这么一小段代码，它非常令人印象深刻，干得好，Luc！谢谢！
0赞
sproketboy
3/9/2015
你也能把它竖起来吗？
-1赞
Martin
5/1/2012
#11
下面的代码应该足以帮助您入门。在 Opera、IE 和 Chrome 中测试。
<script>
var l=0;
function f(i){
im = 'i' + l;
d=document.all[im];
d.height=99;
document.all.f1.t1.value=i;
im = 'i' + i;
d=document.all[im];
d.height=1;
l=i;
}
</script>
<center>
<form id='f1'>
<input type=text value=0 id='t1'>
</form>
<script>
for (i=0;i<=50;i++)
{
s = "<img src='j.jpg' height=99 width=9 onMouseOver='f(" + i + ")' id='i" + i + "'>";
document.write(s);
}
</script>
评论
14赞
Yi Jiang
5/1/2012
内联事件，元素 - 就像 1999 年一样！document.write<center>
3赞
Denes Ferenc
6/26/2012
#12
有一个很好的javascript滑块，它很容易实现。您可以在此处下载 zip 包：http://ruwix.com/javascript-volume-slider-control/
P.S. 这里是上述脚本的简化版本：
20赞
Stephane Rolland
2/1/2013
#13
一个简单的滑块：我刚刚在纯 HTML5 中测试过它，它是如此简单！
<input type="range">
它在 Chrome 上就像一个魅力。我还没有测试过其他浏览器。
评论
0赞
Mostafiz Rahman
7/3/2014
你能再澄清一点吗？
2赞
Stephane Rolland
7/3/2014
我认为你应该写一个html文件，并在接受HTML5的浏览器中浏览这个文件。你会看到一个简单的滑块。<input type="range">
0赞
Mostafiz Rahman
7/3/2014
好！我明白了。
评论
<input type="range">