Изменение внешнего вида checkbox & radio button
Posted on Сентябрь 3, 2007
Filed Under javascript, form, html |
Бывают случаи когда необходимо изменить внешний вид элементов формы checkbox & radio button. Недавно нашел решение с использованием javascript.
Сначала качаем скрипты, для коректной работы необходимы screensmall.css, mootools.js и moocheck.js. Из файла стилей, при более близком расмотрении, нам необходимо всего несколько строчек:
.checked{background-color:#222;background-image:url(chk_on.png)}
.unchecked{background-color:#1c1c1c;background-image:url(chk_off.png)}
.selected{background-color:#222;background-image:url(rdo_on.png)}
.unselected{background-color:#1c1c1c;background-image:url(rdo_off.png)}
Следущий шаг это изображения, на которые мы собственно и будем заменять checkbox & radio button:
Ну и наконец HTML:
<label>
<input type="checkbox" />Checkbox value
</label>
<label>
<input name="leftcol" type="radio" />Radio value
</label>
Результат можно посмотреть на demo странице.
Для более побробного ознакомления на офф сайт.
Comments
One Response to “Изменение внешнего вида checkbox & radio button”
Leave a Reply
-
Поиск
-
Счетчики
-
-
На правах рекламы:
не работает в опере