范围滑块/双滑块不使用框架而存在
我正在寻找一个 JavaScript 控件,它是一个范围滑块(双旋钮),它:
- 不使用现有的 JS 框架(例如 dojo、jQuery 等)- 除非您可以滚动/创建自己的子框架,其中我可以只编译我需要的组件。
- 适用于所有主要浏览器
下面是范围滑块的示例,但是当然这使用了 jQuery - 所以这不是一个选项,因为即使我构建了仅包含组件的 jQuery我需要(jQuery UI 核心+滑块),它是 140kb
MINIFIED:
I'm looking for a JavaScript control that is a Range Slider (dual knob) that:
- does NOT use an existing JS framework (e.g. dojo, jQuery, etc.) - unless you can roll/create your own sub framework where I can compile in just the components I need.
- works in all major browsers
An example a Range Slider is below, but of course this uses jQuery - so this is not an option because even if I built jQuery only including the components I need (jQuery UI core + Slider) it's 140kb
MINIFIED:
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
jQuery UI 有一个很好的:
http://jqueryui.com/demos/slider/
jQuery UI has a nice one:
http://jqueryui.com/demos/slider/
YUI 3(目前处于预览版)仅提取完成您要求的操作所需的绝对最少量的代码。 他们的基本滑块示例(http://yuilibrary.com/yui/docs/slider/slider-basic.html)仅拉入24k 的 JavaScript 和不到 1k 的 CSS。 它非常光滑。
披露:我在雅虎工作。
YUI 3 (which is currently in preview release) only pulls in the absolute minimum amount of code required to do what you ask. Their basic slider example (http://yuilibrary.com/yui/docs/slider/slider-basic.html) only pulls in 24k of JavaScript and less than 1k of CSS. It's pretty slick.
disclosure: I work for Yahoo!.
使用 http://www.walterzorn.com/dragdrop/dragdrop_e.htm 中的滑块代码#插件。 它是一个单一的句柄,但底层的drag-drop.js 非常灵活。 您只需添加自己的第二个滑块,并根据其他条的位置以编程方式锁定每个条的最小-最大范围。 您正在查看 1 个 12kb(lgpl'ed)脚本以及大约 10-20 行代码来实现此功能。
Use the slider code from http://www.walterzorn.com/dragdrop/dragdrop_e.htm#addons. It's a single handle but the underlying drag-drop.js is very flexible. You just need to add your own second slider and programmatically lock each bars' min-max range based on the position of the other. You're looking at 1 12kb (lgpl'ed) script include and about 10-20 lines of code to implement this.