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


Помогите Изменить Внешний Вид Товара


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 6

#1 dmitriy750

dmitriy750

    Пользователь

  • Пользователи
  • PipPip
  • 37 сообщений

Отправлено 10 Январь 2017 - 15:15

При наведении на товар хотелось бы убрать появление звездочек рейтинга, в избранное, в сравнение.
А оставить, при наведении на всю ширину картинки кнопку "В корзину" и чтобы так же затемнялась фотография.

Прикрепленные изображения

  • Безымянный.png


#2 RayLi

RayLi

    Активный участник

  • Модераторы
  • 2 864 сообщений

Отправлено 10 Январь 2017 - 17:20

Просмотр сообщенияdmitriy750 (10 Январь 2017 - 15:15) писал:

При наведении на товар хотелось бы убрать появление звездочек рейтинга, в избранное, в сравнение.
А оставить, при наведении на всю ширину картинки кнопку "В корзину" и чтобы так же затемнялась фотография.

Здравствуйте.
В данном случае попробуйте, пожалуйста, произвести следующие изменения:
В шаблоне main.css найдите, пожалуйста, данный код:

.products-grid .item .item-inner .item-img .ratings {
	position: absolute;
	opacity: 0;
	bottom: 50%;
	left: 40%;
}

И замените его вот этим вот кодом:

.products-grid .item .item-inner .item-img .ratings {
	position: absolute;
	opacity: 0;
	bottom: 50%;
	left: 40%;
	display: none;
}


После чего в том же шаблоне найдите, пожалуйста, следующий код:

.products-grid .item .item-inner .item-img:hover .actions a.add-wishlist {
	right: 55px;
}

И замените его вот этим кодом:

.products-grid .item .item-inner .item-img:hover .actions a.add-wishlist {
	right: 55px;
	display: none;
}


Далее снова там же найдите, пожалуйста, данный код:

.products-grid .item .item-inner .item-img:hover .actions a.add-compare {
	right: 0;
}

И замените его, пожалуйста, вот этим вот кодом:

.products-grid .item .item-inner .item-img:hover .actions a.add-compare {
	right: 0;
	display: none;
}


#3 dmitriy750

dmitriy750

    Пользователь

  • Пользователи
  • PipPip
  • 37 сообщений

Отправлено 10 Январь 2017 - 20:49

Спасибо, получилось.
Только теперь надо сделать чтобы при наведении кнопка "в корзину" выдвигалась на всю длину фотографии товара.
(скрин прикрепил)

Прикрепленные изображения

  • Безымянный.png


#4 RayLi

RayLi

    Активный участник

  • Модераторы
  • 2 864 сообщений

Отправлено 11 Январь 2017 - 09:55

Просмотр сообщенияdmitriy750 (10 Январь 2017 - 20:49) писал:

Спасибо, получилось.
Только теперь надо сделать чтобы при наведении кнопка "в корзину" выдвигалась на всю длину фотографии товара.
(скрин прикрепил)

Здравствуйте.
В таком случае попробуйте, пожалуйста, произвести следующие изменения:
В шаблоне main.css найдите, пожалуйста, данный код:

.products-grid .item .item-inner .item-img .actions a:hover, .products-grid .item .item-inner .item-img .actions a.added {
	background: #c7081b;
	color: #fff;
}

И замените его вот этим вот кодом:


.products-grid .item .item-inner .item-img .actions a:hover, .products-grid .item .item-inner .item-img .actions a.added {
	background: #c7081b;
	color: #fff;
	width: 100%;
}


#5 dmitriy750

dmitriy750

    Пользователь

  • Пользователи
  • PipPip
  • 37 сообщений

Отправлено 11 Январь 2017 - 10:46

Сделал как вы написали.
По итогу получилось что, при наведении на картинку товара кнопка так же вылазит на половину, а вот при наведении на кнопку она вылазит до конца.
Скрин прикрепил.

Прикрепленные изображения

  • скрин.png


#6 RayLi

RayLi

    Активный участник

  • Модераторы
  • 2 864 сообщений

Отправлено 11 Январь 2017 - 13:08

Просмотр сообщенияdmitriy750 (11 Январь 2017 - 10:46) писал:

Сделал как вы написали.
По итогу получилось что, при наведении на картинку товара кнопка так же вылазит на половину, а вот при наведении на кнопку она вылазит до конца.
Скрин прикрепил.

Тогда в шаблоне main.css найдите, пожалуйста, снова данный код:

.products-grid .item .item-inner .item-img .actions .add-cart {
	padding: 0;
	width: 160px;
	left: -160px;
}

И замените его вот этим вот кодом:

.products-grid .item .item-inner .item-img .actions .add-cart {
	padding: 0;
	width: 100%;
	left: 100%;
}


#7 dmitriy750

dmitriy750

    Пользователь

  • Пользователи
  • PipPip
  • 37 сообщений

Отправлено 11 Январь 2017 - 13:16

Благодарю за помощь) Все получилось.




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных