Skip to content
leo-naeka edited this page Jan 13, 2012 · 3 revisions

Summary

Use

Simple use

$(":checkbox").switchbutton();

Advanced use

$(":checkbox").switchbutton({
   
    classes: 'ui-switchbutton-thin',
   
    duration: 300,
   
    checkedLabel: 'I',
   
    uncheckedLabel: 'O'
   
});

Browsers compatibility

jquery-switchbutton browsers compatibility

You may have noticed that even if css border-radius is supported on IE9, the background is not stripped and covers the whole original square (more visible with ios5 style).

To prevent this visual glitch, you should include in your HTML:

<!--[if gte IE 9]>
  <style type="text/css">
    .ui-switchbutton-default .ui-switchbutton-handle {
       border-radius: 0px;
    }
  </style>
<![endif]-->