Новый checkbox

[olegumar]

Кто уже предлагал свои варианты checkbox, но не удачно. Хочу попробовать предложить свой вариан который я использую. На мой взгляд он очень хорошо вписывается в ваш дизайн. Вот код CSS: / .slideThree / .slideThree { width: 80px; height: 25px; background: #A7C6DD; margin: 20px auto; position: relative; border-radius: 50px; box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2); } .slideThree:after { content: 'OFF'; color: #140f0b; position: absolute; right: 10px; z-index: 0; font: 12px/26px Arial, sans-serif; font-weight: bold; text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15); } .slideThree:before { content: 'ON'; color: #317f43; position: absolute; left: 10px; z-index: 0; font: 12px/26px Arial, sans-serif; font-weight: bold; } .slideThree label { display: block; width: 34px; height: 20px; cursor: pointer; position: absolute; top: 3px; left: 3px; z-index: 1; background: #fcfff4; background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); border-radius: 50px; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); } .slideThree input[type=checkbox] { visibility: hidden; } .slideThree input[type=checkbox]:checked + label { left: 43px; } / end .slideThree /

[renat2985]

Свяжитесь со мной в Skype: renat2985

[olegumar]

Как стоит у меня на страничке HTML:

<div class="slideThree"><input type="checkbox" id="1pul" onchange="fun1()" ><label for="1pul"></label></div>

[olegumar]

Еще можно попросить сделать пару кнопок в редакторе ? Номе - переход на начальную страницу Settings - на страницу с настройками.

[olegumar]

Ренат, не знал где написать. Нашел инфу, где сказано, что писать коды для ESP можно и на JS, Для тебя это наверно самое то. http://wiki.amperka.ru/js:ide тут описание есть.