Здравствуйте! В Woocommerce с помощью чекбоксов выбирается способа доставки. Нужно что бы выделялся фон выбранного способа. Насколько я понимаю, это можно сделать присвоив выбранному способу дополнительный класс css... Но как это сделать? Помогите пожалуйста.. Код html в фаербаге примерно такой получается: Код (PHP): <li class="shipping_method"> <input type="radio" name="shipping_method[0]" data-index="0" id="shipping_method_0_flat_rate" value="flat_rate" class="shipping_method" checked="checked"><label for="shipping_method_0_flat_rate">Доставка1</label><div style="float:right;">300 руб.</div></li> <li class="shipping_method"> <input type="radio" name="shipping_method[0]" data-index="0" id="shipping_method_0_local_delivery" value="local_delivery" class="shipping_method"><label for="shipping_method_0_local_delivery">Доставка2</label><div style="float:right;">500 руб.</a></div></li> p.s. Пробовал сделать просто через css Код (PHP): .woocommerce ul#shipping_method li:active {background: #dedede;} - не получается (фон выделяется только на момент нажатия ссылки)... ( Подсказка от модератора: Любой код или текст конфигурации пишите между тегом [code=php] и [/code]. Используйте отступы в коде для форматирования текста. Это помогает быстрее понять вас, увеличивает шанс на получение ответа. Что выделять? Например: PHP, HTML, CSS, JavaScript, SQL, XML, .htaccess, ini, регулярные выражения, код шаблонизаторов, любая другая разметка, результаты array/object dump и т. д.
Да, спасибо - это похоже именно то, что нужно.. но так пока и не понял, как сделать что бы стиль применялся ко всему блоку, а не только к чекбоксу.. ( Пишу Код (PHP): .woocommerce ul#shipping_method li :checked{margin:10px; background: #dedede;} -чекбокс сдвигается, фон не меняется... Код (PHP): .woocommerce ul#shipping_method :checked + li{margin:10px; background: #dedede;} (вроде бы как в примере - но не работает если пишу Код (PHP): .woocommerce ul#shipping_method li input:checked + label { - меняется фон только у заголовка.. а мне надо весь блок, который относится к этому чекбоксу Подсказка от модератора: Любой код или текст конфигурации пишите между тегом [code=php] и [/code]. Используйте отступы в коде для форматирования текста. Это помогает быстрее понять вас, увеличивает шанс на получение ответа. Что выделять? Например: PHP, HTML, CSS, JavaScript, SQL, XML, .htaccess, ini, регулярные выражения, код шаблонизаторов, любая другая разметка, результаты array/object dump и т. д.
Код (PHP): .woocommerce .shipping_method input:checked + label https://jsfiddle.net/mkf7q9em/Добавлено спустя 9 минут 32 секунды:вроде нельзя сделать, то что ты хочешь
Добавлено спустя 9 минут 32 секунды: А через php задать дополнительный класс для блока с включенным чекбоксом?... Правда в php я понимаю еще меньше чем в css (про jquery уже совсем молчу).. ((
думаю надо переверстать, чтобы только один блок раскрашивать или дублировать для label и div которые рядом
попробуй вынести input вынести выше вашего блока . скрой input через display:none. создай дополнительный label каждому чекбоксу и стилизуй их под чекбокс. Как здесь: http://ruseller.com/lessons.php?id=1656&rub=2 Так ты сможешь стилизовать блок,при клике ,в котором содержится чекбокс по которому ты кликнул.
Мне кажется, все-таки более простой метод - это добавлять класс css выбранному элементу с помощью php или js... жалко что я не знаю как это сделать... (( попробовал добавить скрипт Код (PHP): <script> $('#shipping_method').click(function(){ if($(this).is(":checked")) { $(this).addClass("checked"); } else { $(this).removeClass("checked"); } }); </script> - пока не работает..(( Подсказка от модератора: Любой код или текст конфигурации пишите между тегом [code=php] и [/code]. Используйте отступы в коде для форматирования текста. Это помогает быстрее понять вас, увеличивает шанс на получение ответа. Что выделять? Например: PHP, HTML, CSS, JavaScript, SQL, XML, .htaccess, ini, регулярные выражения, код шаблонизаторов, любая другая разметка, результаты array/object dump и т. д.