Чекбоксы в стиле iPhone с помощью jQuery
http://www.ruseller.com/lessons/les290/example/demo.html
Этот короткий урок поможет Вам превратить простые чекбоксы в более привлекательные с помощью jQuery.
Первым делом в шапке документа подключаем фреймворк, стили и дополнительный скрипт:
<script src="jquery-1.3.2.js" type="text/javascript" charset="utf-8"></script>
<script src="iphone-style-checkboxes.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8" />
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$(':checkbox').iphoneStyle();
});
</script>
Далее в любом месте документа вставляем, как обычно, чекбоксы. В примере показано 2 варианта (включенный и выключенный):
<h2>Выключено по умолчанию</h2>
<input type="checkbox" />
<h2>Включено по умолчанию</h2>
<input type="checkbox" checked="checked" />
На обработку формы, в которой будут использованы такие чекбоксы, это никак не влияет. Суть остается та же, меняется только внешний вид.
Есть небольшое отличие от iPhone: в телефоне необходимо перетаскивать слайдер, здесь же необходимо нажимать на необходимый вариант!