Перейти к содержанию
Andruhi4

Увеличить фото товара при наведении

Рекомендуемые сообщения

Добрый день! подскажите, как можно сделать так, чтоб при нахождении в категории, наведя на картинку одного из товара, она увеличилась например в 500х500 px???

1.5.3.1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Здравствуйте, лично я пользуюсь zoomi.js

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Здравствуйте, лично я пользуюсь zoomi.js

спасибо, а как теперь вставить в OC это правильно?? я так понимаю, что надо теперь загружать 2 картинки... 1: маленькая картинка, которая будет возле описания товара, и картинка побольше, которая будет появляться при наведении, так?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

маленькая картинка, которая будет возле описания товара, и картинка побольше, которая будет появляться при наведении, так?

Нет. Размер изображения Вы устанавливаете в контроллере, а в шаблоне Вы ограничиваете изображение в размере и прописываете для тега класс "zoomi".

Пример:

<img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />
Так же не забудьте добавить библиотеку:

<script type="text/javascript" src="catalog/view/javascript/zoomi.js"></script>

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Нет. Размер изображения Вы устанавливаете в контроллере, а в шаблоне Вы ограничиваете изображение в размере и прописываете для тега класс "zoomi".

Пример:

<img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />

Так же не забудьте добавить библиотеку:

<script type="text/javascript" src="catalog/view/javascript/zoomi.js"></script>

А можно поподробней описать!Для не продвинутых.Для категорий.

Если не сложно.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Добрый день! подскажите, как можно сделать так, чтоб при нахождении в категории, наведя на картинку одного из товара, она увеличилась например в 500х500 px???

1.5.3.1

Извините!

Скажите.Вы решили как это сделать?

Не могли бы написать решение.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Прошу прощение просмотрел... Вопрос ещё актуален?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Прошу прощение просмотрел... Вопрос ещё актуален?

Да,актуален!

Не нашол решения так как не профи в этом!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Вы скачали библиотеку zoomi.js? Если нет, то скачайте.

Далее в контроллере Вам необходимо задать тот размер картинке, который будет соответствовать "увеличенной" картинке, затем в шаблоне Вы можете задать размер картинке до "увеличения" атрибутами width и height, так же обязательно присвоить класс "zoomi"

Пример:

<img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Вы скачали библиотеку zoomi.js? Если нет, то скачайте.

Далее в контроллере Вам необходимо задать тот размер картинке, который будет соответствовать "увеличенной" картинке, затем в шаблоне Вы можете задать размер картинке до "увеличения" атрибутами width и height, так же обязательно присвоить класс "zoomi"

Пример:

<img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />

Спасибо!

Что нужно делать я уже читал выше.

Вопрос как.

Библиатеку "zoomi" я скачал и закинул в catalog/view/javascript

Что и как править в контроллере?

Куда вписать

<script type="text/javascript" src="catalog/view/javascript/zoomi.js"></script>

я прописал в header.tpl между тегами <head> <head>

дальше куда прописать <img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" /> ???

Вот собственно что нужно.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

К примеру в контроллере product\category\category.php (вывод продуктов в категории) есть цикл где формируется массив продуктов для вывода пользователю, при переборе продуктов вместе с остальной информацией о продукте подготавливается изображение продукта.

$image = $this->model_tool_image->resize($image, $this->config->get('config_image_product_width'), $this->config->get('config_image_product_height'));

параметры метода resize $this->config->get('config_image_product_width') и $this->config->get('config_image_product_height') задают ширину и высоту изображения, Вы можете их изменить на нужные Вам. Пример:

$image = $this->model_tool_image->resize($image, 300, 300);

<script type="text/javascript" src="catalog/view/javascript/zoomi.js"></script> - всё верно вставили.

В шаблоне вывода категорий catalog\view\theme\default\template\product\category.tpl есть цикл для вывода продуктов пользователю, вот как раз там и нужно вносить эти изменения:

<img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

К примеру в контроллере product\category\category.php (вывод продуктов в категории) есть цикл где формируется массив продуктов для вывода пользователю, при переборе продуктов вместе с остальной информацией о продукте подготавливается изображение продукта.

$image = $this->model_tool_image->resize($image, $this->config->get('config_image_product_width'), $this->config->get('config_image_product_height'));
параметры метода resize $this->config->get('config_image_product_width') и $this->config->get('config_image_product_height') задают ширину и высоту изображения, Вы можете их изменить на нужные Вам. Пример:

$image = $this->model_tool_image->resize($image, 300, 300);
<script type="text/javascript" src="catalog/view/javascript/zoomi.js"></script> - всё верно вставили.

В шаблоне вывода категорий catalog\view\theme\default\template\product\category.tpl есть цикл для вывода продуктов пользователю, вот как раз там и нужно вносить эти изменения:

<img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />

Это будет работать на opencart 1.5.4.1 ? Подскажите пожалуйста по точней куда вставить эту строку <img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Это будет работать на opencart 1.5.4.1 ? Подскажите пожалуйста по точней куда вставить эту строку <img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />

Да. Для приведённого мной примера необходимо заменить в файле catalog\view\theme\default\template\product\category.tpl строчку

<div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" /></a></div>

на

 

<div class="image"><a href="<?php echo $product['href']; ?>"><img class="zoomi" src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" width="40" height="40" /></a></div>

Написал без проверки, но вроде всё верно.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Это будет работать на opencart 1.5.4.1 ? Подскажите пожалуйста по точней куда вставить эту строку <img class="zoomi" src="<?php echo $value['image']; ?>" width="40" height="40" />

Да. Для приведённого мной примера необходимо заменить в файле catalog\view\theme\default\template\product\category.tpl строчку

<div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" /></a></div>

на

 

<div class="image"><a href="<?php echo $product['href']; ?>"><img class="zoomi" src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" width="40" height="40" /></a></div>

Написал без проверки, но вроде всё верно.

Я вчера так и допилил сам к вечеру ,  Спасибо ! )  в строчке нужно это убрать : alt="<?php echo $product['name']; ?>" . Иначе не работает .

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Ребята, подскажите, пожалуйста, новичку.

 

Скачал библиотеку, установил в папку \catalog\view\javascripе

 

Как сделать, чтобы данный скрипт заработал на главной страничке, а не в категории.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Простите, а в версии 1.5.4.1 у меня в файле \catalog\controller\product\category.php нет такой строки:

 

 

$image = $this->model_tool_image->resize($image, $this->config->get('config_image_product_width'), $this->config->get('config_image_product_height'));

 

Есть строка:

 

 $image = $this->model_tool_image->resize($result['image'], $this->config->get('config_image_product_width'), $this->config->get('config_image_product_height'));
 

Как я понимаю, править нужно её для установки максимального размера при увеличении. Но что - то не выходит, после моих правок картинки потом вообще не отображаются. Не подскажете, как исправить? Новичок...

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Как я понял, в моей версии надо писать:

$image = $this->model_tool_image->resize($result['image'], 300, 300);

И это аналогично, если в админке - управление магазином - изображения - изменить параметр "Размер изображения в списке товаров". Но какая - то мистика получается: там сейчас стоит 80x80, если поменять на, скажем, 100x100 - работает, картинки при наведении увеличиваются до 100x100. Однако, если поставить, скажем, 300x300 - выходят предупреждения от php наверху типа таких:

 

"Warning: imagejpeg(): Unable to open '/opt/ocstore/image/cache/data/odezda/2354_1big[1]-300x300.jpg' for writing: Permission denied in /opt/ocstore/system/library/image.php on line 45 Warning: fopen(/opt/ocstore/system/logs/error.txt): failed to open stream: Permission denied in /opt/ocstore/system/library/log.php on line 12 Warning: fwrite() expects parameter 1 to be resource, boolean given in /opt/ocstore/system/library/log.php on line 14 Warning: fclose() expects parameter 1 to be resource, boolean given in /opt/ocstore/system/library/log.php on line 16"

 

И картинки товаров перестают отображаться, причём их рамки и вообще весь текст выстраиваются по диагонали. Странно :mellow:

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.