Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Non-confusing, 'windowed slider' checkboxes and dropdowns with jQuery
JavaScript
branch: master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
minified
LICENSE.md
README.md
VERSION
animated-demo.gif
jquery.windowed.js
windowed.css

README.md

windowed.js

Animated demo

windowed.js is a jQuery plugin that implements Chris Norström's awesome "Windowed Slider" concept. It takes your regular checkboxes or <select> lists and transforms them into slick 'windowed sliders'.

For documentation, usage, and examples, see: http://www.alexpeattie.com/projects/windowed/

Requirements

File size

  • Uncompressed: 12.75 Kb
  • Minified: 5.9 Kb
  • Minified + gzipped: 2.2 Kb

Quickstart

Add the windowed.min.css and jquery.windowed.min.js files to your HTML page:

<head>
  <link rel="stylesheet" href="path/to/windowed.min.css">
</head>
<body>
  <!-- blah blah -->
  <script src='jquery.js'></script>
  <script src='/path/to/jquery.windowed.min.js'></script>
</body>

Transform your checkbox or <select> by calling .windowed():

$("select, input:checkbox").windowed();

See the site for more usage and examples

Compatibility

See Compatibility in the wiki for the most up-to-date info.

I've tested the plugin with recent versions of Firefox, Chrome and Safari (mobile & desktop) - theoretically it should work fine in IE7+ and Opera, but these are untested. If you've tried the plugin with an untested browser, please, add it to the wiki!

Credits

Changelog

Version 0.1.0 (2012-11-28): Initial version.

Todo

  • Add ability to swap the checkbox labels (i.e. have OFF on the left, rather than the right)
  • Responsive (variable width) components
  • Add tabbing support/keyboard navigation

Contributing

If you want to have a stab at any of the todo items above - or anything else - pull requests are gratefully received.

For any bug reports or feature ideas, head over to Issues. Another big help would be to expand the documentation on browser compatibility in the wiki.

License

windowed.js is freely distributable under the terms of the MIT license (see LICENSE.md).

Something went wrong with that request. Please try again.