В Веб-форме нужно сделать кнопку с картинкой.
Нажал первый раз -  картинка сменилась, осталась нажата.
Нажал второй раз - отжалась, картинка вернулась к исходной.
При этом надо производить некие действия и иметь возможность считывать значение элемента (или сохранять его где-то).
По описанию получается чекбокс...

Пробовал несколько вариантов чекбоксов в виде картинок. Везде хромала кроссбраузерность разными способами. 
Кнопки спрайтами CSS не удовлетворили - они реагируют на наведение мышкой или однократное нажатие. Второй раз уже не нажимаются или я не нашёл как.

Нужен дубовый вариант, который работает везде. 
Есть примеры?



Это сообщение отредактировал(а) kuksha - 20.10.2014, 15:30

http://jsfiddle.net/4huzr/

Дубовый вариант - это CSS3, предложенный ваше + дублирование на JS (или jQ для упрощения), для старых браузеров.
Ты бы написал какая кроссбразуерность нужна. Надо ли IE6, а может надо IE5?

Вот статьи (с первой страницы гугла) подробно расписывающие вариант предложенный Aliance
http://htmlbook.ru/blog/kartinka-vmesto-chekboksa
http://habrahabr.ru/post/144104/
http://habrahabr.ru/sandbox/58557/
http://xiper.net/collect/html-and-css-tric...m/nice-checkbox