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


Всплывающее Краткое Описание Товара


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

#1 Barmalei

Barmalei

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

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

Отправлено 27 Май 2012 - 17:20

Здравствуйте!
Нельзя ли сделать, чтобы при наведении курсора на какой-либо товар, всплывало сообщение с кратким описанием товара (краткое описание - которое задаётся на странице редактирования товара).
P.S. рассматриваемый вопрос актуален при отображении товаров в виде таблицы.

#2 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 28 Май 2012 - 21:22

Подобный вопрос рассматривался в следующей теме http://forum.storela...ndpost__p__7021
Вам необходимо просто в блок вставить переменную выводящую описание товара или что-то другое.

#3 Barmalei

Barmalei

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

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

Отправлено 05 Июнь 2012 - 08:36

Просмотр сообщенияVaccina (28 Май 2012 - 21:22) писал:

Подобный вопрос рассматривался в следующей теме http://forum.storela...ndpost__p__7021
Вам необходимо просто в блок вставить переменную выводящую описание товара или что-то другое.

Там Вы рассматриваете вопрос, когда нужно нажать куда-то, чтобы вышла подсказка.
А мне нужно без нажатия, когда мы смотрим список товаров на сайте и наводим мышью на стоимость товара - то всплывает окно: сколько стоит этот товар (см.рис.). Мне хотелось бы, чтобы при наведении мышью на рисунок товара, или его название - точно также, подобно цене, всплывало краткое описание товара (кажется, это свойство {goods.DESCRIPTION_SHORT}).

Изображение

#4 Barmalei

Barmalei

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

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

Отправлено 05 Июнь 2012 - 09:20

ах, да, сайт: alpa-shop.ru

#5 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 05 Июнь 2012 - 20:57

Вам необходимо изменить alt у изображения в шаблоне "Товары"

<img {% IF goods.IMAGE_EMPTY %}src="{ASSETS_IMAGES_PATH}no-photo-medium.png" width="220"{% ELSE %}src="{goods.IMAGE_SMALL}"{% ENDIF %} alt="{goods.NAME}" />

изменить на

<img {% IF goods.IMAGE_EMPTY %}src="{ASSETS_IMAGES_PATH}no-photo-medium.png" width="220"{% ELSE %}src="{goods.IMAGE_SMALL}"{% ENDIF %} alt="{goods.DESCRIPTION_SHORT}" />


#6 Barmalei

Barmalei

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

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

Отправлено 06 Июнь 2012 - 19:49

Просмотр сообщенияVaccina (05 Июнь 2012 - 20:57) писал:

Вам необходимо изменить alt у изображения в шаблоне "Товары"

<img {% IF goods.IMAGE_EMPTY %}src="{ASSETS_IMAGES_PATH}no-photo-medium.png" width="220"{% ELSE %}src="{goods.IMAGE_SMALL}"{% ENDIF %} alt="{goods.NAME}" />

изменить на

<img {% IF goods.IMAGE_EMPTY %}src="{ASSETS_IMAGES_PATH}no-photo-medium.png" width="220"{% ELSE %}src="{goods.IMAGE_SMALL}"{% ENDIF %} alt="{goods.DESCRIPTION_SHORT}" />

Эм... Нет. Это что-то не то.
А Вы не могли бы написать, какая функция/свойство отвечает за эту "всплывающую" цену (ту, что на картинке выше)?

#7 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 06 Июнь 2012 - 21:14

Это стандартная функция самого браузера - на неё нельзя повлиять.
Как вариант это реализация подсказок как описано тут http://forum.storela...dpost__p__21513

или же как описано по ссылке  http://forum.storela...dpost__p__21491

#8 Barmalei

Barmalei

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

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

Отправлено 07 Июнь 2012 - 18:55

Просмотр сообщенияVaccina (06 Июнь 2012 - 21:14) писал:

Это стандартная функция самого браузера - на неё нельзя повлиять.
Как вариант это реализация подсказок как описано тут http://forum.storela...dpost__p__21513

или же как описано по ссылке  http://forum.storela...dpost__p__21491

Ага, посмотрел. Сделал, вроде.
Только посмотрите теперь, как подсказки эти отображаются в Эксплорере.. Как исправить? http://alpa-shop.ru/catalog/Ионизаторы
А так-же, после этих махинаций в том же Эксплорере на главной странице товары разъехались: http://alpa-shop.ru/

Воот. А в опере у некоторых товаров вместо картинки стало название товара отображаться красным - тоже желательно исправить...

Жду скорейшего ответа, т.к. у меня там всё так и выглядит как-попало. Спасибо!

#9 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 07 Июнь 2012 - 21:03

Вы не все изменения сделали. Перечитайте тему еще раз. Вам необходимо изменить z-index
А так же не совсем ясно как изменения могли повлиять на вашу главную страницу.

В файле стилей найдите

.goodsListItem {
	padding: 0;
	text-align: center;
	vertical-align: top;
	width: 200px;
}

замените на

.goodsListItem {
	padding: 0;
	text-align: center;
	vertical-align: top;
}

Цитата

Воот. А в опере у некоторых товаров вместо картинки стало название товара отображаться красным - тоже желательно исправить...

Так же не совсем понятна взаимосвязь. Укажите ссылку на пример.

#10 Barmalei

Barmalei

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

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

Отправлено 08 Июнь 2012 - 10:25

А, ну да. Тогда не могли бы Вы посмотреть, почему у меня на главной странице так получилось?

#11 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 08 Июнь 2012 - 17:54

Если вы про главную в IE - то я вам дала рекомендацию для устранения проблемы.
Продублирую

В файле стилей найдите

.goodsListItem {
	padding: 0;
	text-align: center;
	vertical-align: top;
	width: 200px;
}

замените на

.goodsListItem {
	padding: 0;
	text-align: center;
	vertical-align: top;
}


#12 Barmalei

Barmalei

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

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

Отправлено 08 Июнь 2012 - 18:55



#13 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 13 Июнь 2012 - 13:07

Попробуйте в файле стилей найти

.goodsListItemBlock {
	height: 230px;
	margin: 10px;
	position: relative;
	width: 150px;
}

и заменить на

.goodsListItemBlock {
	height: 230px;
	margin: 10px;
	position: relative;
	width: 150px;
	z-index: 2;
}

Цитата

а ещё откройте http://alpa-shop.ru/...%BE%D1%80%D1%8B в Google Chrome... Там мои подсказки в окне с товаром отобразились (см. рис.). Давайте уберём?

Не совсем понятно происходящее у вас на скриншоте, так как у меня в Google Chrome все нормально отображается.

#14 Barmalei

Barmalei

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

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

Отправлено 13 Июнь 2012 - 18:30

Просмотр сообщенияVaccina (13 Июнь 2012 - 13:07) писал:

Попробуйте в файле стилей найти

.goodsListItemBlock {
	height: 230px;
	margin: 10px;
	position: relative;
	width: 150px;
}

и заменить на

.goodsListItemBlock {
	height: 230px;
	margin: 10px;
	position: relative;
	width: 150px;
	z-index: 2;
}

В IE ничего не изменилось, зато в Опере стало также плохо, как в IE. Так что я всё вернул как было. Что делать?


Просмотр сообщенияVaccina (13 Июнь 2012 - 13:07) писал:

Не совсем понятно происходящее у вас на скриншоте, так как у меня в Google Chrome все нормально отображается.

А какая у Вас версия GC?

А ещё можно сделать так, чтобы и у товаров на главной странице такие подсказки всплывали?

#15 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 14 Июнь 2012 - 22:17

Цитата

В IE ничего не изменилось, зато в Опере стало также плохо, как в IE. Так что я всё вернул как было. Что делать?
Довольно странная ситуация, как я поняла проблема только в IE7, как вариант можно использовать костыль на javascript.

$('.goodsListItem').each(function(index){
  $(this).css({'position':'relative', 'z-index':(index - 999)});
}); 

Этот код необходимо разместить в файл main.js после строки

$(document).ready(function(){

Цитата

А какая у Вас версия GC?
18

Цитата

А ещё можно сделать так, чтобы и у товаров на главной странице такие подсказки всплывали?

Можно, это делается аналогично, просто изменения вносятся в шаблон "HTML"

#16 Barmalei

Barmalei

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

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

Отправлено 15 Июнь 2012 - 19:13

Ой-ёй-ёй!!! С этой функцией

Цитата

$('.goodsListItem').each(function(index){
  $(this).css({'position':'relative', 'z-index':(index - 999)});
});
у меня вообще ссылки на товары перестали работать (т.е. вообще не получалось на страницу товара войти)!!!

Только бэкап помог..

#17 Barmalei

Barmalei

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

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

Отправлено 15 Июнь 2012 - 19:19

Кстати, у меня IE9

#18 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 15 Июнь 2012 - 21:24

Прошу прощенья, допустила ошибку (отрицательное значение). Замените

$('.goodsListItem').each(function(index){
  $(this).css({'position':'relative', 'z-index':(index - 999)});
});


на

$('.goodsListItem').each(function(index){
  $(this).css({'position':'relative', 'z-index':(999 - index)});
});


#19 Barmalei

Barmalei

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

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

Отправлено 16 Июнь 2012 - 14:18

Спасибо большое! Вот теперь всё работает как надо! Спасибо!

#20 Barmalei

Barmalei

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

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

Отправлено 17 Июнь 2012 - 09:44

Цитата

Можно, это делается аналогично, просто изменения вносятся в шаблон "HTML"
Я так понял нужно всего лишь исправить в шаблоне HTML
<div class="goodsListItemBlock withBorder cornerAll">
на
<div class="goodsListItemBlock withBorder cornerAll" style="position:relative;">
и добавить после этого
<div class="show_desc">
{goods.DESCRIPTION_SHORT}
</div>
?
Или как? У меня не получилось.. :unsure:




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

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