Перейти к содержимому


Фотография
- - - - -

Кастомизация вёрстки сервисов доставок и способов оплаты в корзине


Лучший Ответ zeus07 , 18 January 2016 - 18:55

Хм, даже не знаю, как у меня получилось, но для чекбокса с включённым состоянием было что-то не то с классом в CSS у меня, заменил на:

.jbzoo .jbcart-radio-input:checked + .jbcart-radio-label .jbcart-radio

И всё заработало! Мистика)

Перейти к сообщению


  • Закрытая тема Тема закрыта
Сообщений в теме: 14

#1 zeus07

zeus07

Отправлено 15 January 2016 - 19:54

Здравствуйте!

 

Сайт: http://clock.artcolorit.com/

 

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

 

Вот скриншот: http://clip2net.com/s/3sYIGs5

 

В чём может быть проблема? Подскажите пожалуйста.


  • 0

#2 laRus

laRus

Отправлено 15 January 2016 - 21:50

Потому что jbcart-radio переопределяется в стиле шаблона (на "пустой кружочек" ):

r.PNG

 

из-за чего нужный бэкграунд не срабатывает:

r2.PNG


  • 0
..minimum effort for maximum effect? - Oh yeah! It's good!..

#3 zeus07

zeus07

Отправлено 15 January 2016 - 21:53

Если там в 1278 строке прописать изображение с состоянием "checked", то оно будет такое у всех способов


  • 0

#4 laRus

laRus

Отправлено 15 January 2016 - 22:35

Если там в 1278 строке прописать изображение с состоянием "checked", то оно будет такое у всех

а и не надо там это прописывать.. !

 

У тебя в стиле шаблона вот что:

checkbox.png

 

А затирается вот что:

r3.png

 

Ну и.. как бэ..  :)


  • 0
..minimum effort for maximum effect? - Oh yeah! It's good!..

#5 zeus07

zeus07

Отправлено 15 January 2016 - 22:37

Не, ну я видел) 

 

Но у того изображения, которое затирается, должно же меняться как минимум свойство background-position чтобы менялась картинка) и онон по идее где-то меняется, Возможно в каком-то скрипте) 


  • 0

#6 Cheren-dow

Cheren-dow

Отправлено 15 January 2016 - 22:56

zeus07, посмотрите в стилях стили для псевдокласса :checked


  • 0
Изображение
 

#7 zeus07

zeus07

Отправлено 15 January 2016 - 22:59

zeus07, посмотрите в стилях стили для псевдокласса :checked

 

Дело в том, что у меня как раз прописано вот так: 

.jbzoo .jbcart-radio-input:checked:focus + .jbcart-radio-label .jbcart-radio {
   background: url(../images/checkbox-checked.png) no-repeat center !important;
}

  • 0

#8 Cheren-dow

Cheren-dow

Отправлено 15 January 2016 - 23:10

zeus07, посмотрите как через less формируются стили:

\media\zoo\applications\jbuniversal\assets\less\cart\cart.less

Откройте исходный css который подключается, скопируйте и измените под свое изображение.


  • 0
Изображение
 

#9 zeus07

zeus07

Отправлено 15 January 2016 - 23:13

В смысле открыть кешированный файл css уже? И там заменить? Потому что в cart.less этого нет


  • 0

#10 Cheren-dow

Cheren-dow

Отправлено 15 January 2016 - 23:18

zeus07, в файле cart.less есть следующие стили:

// customized radio button START
    .jbcart-radio {

        float: left;
        cursor: pointer;
        margin-right: 12px;
        margin-bottom: 8px;
        position: relative;
        #sprite > .init('../../img/misc/radio.png', 26px);

        &:hover {
            #sprite > .image(1);
        }

        // relate with real radio-button
        &-input {
            #box > .ghost();
            &:hover            + .jbcart-radio-label .jbcart-radio { #sprite > .image(1); }
            &:focus            + .jbcart-radio-label .jbcart-radio { #sprite > .image(1); }
            &:checked          + .jbcart-radio-label .jbcart-radio { #sprite > .image(2); }
            &:checked:hover    + .jbcart-radio-label .jbcart-radio { #sprite > .image(3); }
            &:checked:focus    + .jbcart-radio-label .jbcart-radio { #sprite > .image(3); }
            &:disabled         + .jbcart-radio-label .jbcart-radio { #sprite > .image(4); }
            &:disabled:focus   + .jbcart-radio-label .jbcart-radio { #sprite > .image(4); }
            &:disabled:checked + .jbcart-radio-label .jbcart-radio { #sprite > .image(5); }
        }

        &-label:hover .jbcart-radio,
        label:hover &-input {
            #sprite > .image(1);
        }

    } 

Если вы используете css найдите в кешированном файле уже готовые стили перенесите их в свой файл но измените путь до своей картинки


  • 0
Изображение
 




Click to return to top of page in style!