Показать сообщение отдельно
  #5 (permalink)  
Старый 14.05.2013, 17:08
Аспирант
Отправить личное сообщение для constantant Посмотреть профиль Найти все сообщения от constantant
 
Регистрация: 30.07.2008
Сообщений: 87

Железный вариант:
<div class="checkbox">
    <i></i>
    <input id="ch0" type="checkbox" name="name" />
    <label for="ch0">Лейбл для чекбокса</label>
</div>


.checkbox{
    position:relative;
}
.checkbox input{
    position:absolute;
    top:0;
    left:0;
    width: 38px;
    height: 32px;
    -moz-opacity:0 ;
    filter:alpha(opacity: 0);
    opacity: 0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.checkbox i{
    display:block;
    width: 38px;
    height: 32px;
    position:absolute;
    top:0;
    left:0;
    backgroung:transparent url('/image/url/example.jpg') no-repeat 0 0;
}
.checkbox.checked i{
    background-position:0 -32px;
}
.checkbox label{
    position:relative;
    padding:0 0 0 48px;
}


$('.chackbox').on({
    change:function(ev){
        var parent = $(ev.delegateTarget);
        var input = $(ev.target);
        parent[(input.prop('checked') ? 'addClass' : 'removeClass')]('checked');
    }
});
Ответить с цитированием