Пользовательские радио Div/Изображения/Кнопки

Question

Я хочу функциональность переключателя, но есть возможность выбора на основе изображения. Например, у меня будет ярлык (Способы оплаты). Я хотел бы создать различные DIV/Images с каждым принятым платежом (Кредит/карта, PayPal, Western Union и т. Д.). Вместо того, чтобы выбирать небольшую радиокнопку с маленьким кружком, скорее всего, они просто нажимают на изображение и имеют границу или изменение изображения, чтобы указать, что этот метод выбран.

Было бы еще лучше, если бы у меня была такая функциональность с элементом DIV, таким образом я могу добавить только то, что я хочу в DIV (текст, изображения и т. Д.), И у самого DIV есть своего рода граница, которая появляется при выборе.

Возможно ли это использование входного типа = радио? Если это невозможно с помощью радиостанций, чем то, как вы предлагаете реализовать это? Если это было выполнено, воспользуйтесь ссылкой:

Answer 1

Невозможно напрямую установить флажок или переключатель, однако, что я делаю в этих ситуациях, я делаю свой собственный флажок, используя jQuery, и на основе пользователя выбор, я один из двух thigs:

1) Измените значение скрытого поля,

2) Измените значение флажка, который существует, но не отображается для пользователя, поэтому дисплей :никто; будет применяться к нему.

Это довольно просто, вы можете установить флажок из div даже, допустим, 15px высотой и 15px в ширину и привязать события клика к нему с помощью jQuery. Затем вы можете переключать класс при каждом нажатии, что, в свою очередь, дает вам свободу над стилем и в зависимости от состояния класса или щелчка, вы можете присвоить фактическое значение флажка скрытому или скрытому флажку.

Помогает ли это?

Хороший ресурс для этого: http://www.filamentgroup.com/lab/accessible_custom_designed_checkbox_radio_button_inputs_styled_css_jquery/

Или, если вы хотите иметь плагин сделать работу: http://plugins.jquery.com/taxonomy/term/1360