Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

[РЕШЕНО] Смена картинки при наведении


Recommended Posts

День добрый.

А что надо добавить, чтобы первую картинку зафиксировать, а вторая (текст на полупрозрачном фоне) всплывала поверх первой?

Как здесь http://www.getransportation.com/ 

Версия 1.5.5.2.1

Надіслати
Поділитися на інших сайтах


  • 3 months later...

Для 1.5.4 :

/catalog/controller/product/category.php

Находим строки:

$results = $this->model_catalog_product->getProducts($data); foreach ($results as $result) {
После них вставляем:
$results_img = $this->model_catalog_product->getProductImages($result['product_id']);
$dop_img = array();
foreach ($results_img as $result_img) {
    if ($result_img['image']) {
        $image_dop = $this->model_tool_image->resize($result_img['image'], 241, 241);
    } else {
        $image_dop = false;
    }
    $dop_img[] = $image_dop;
}
Немного ниже ищем строки:
$this->data['products'][] = array( 'product_id' => $result['product_id'],
Ниже нее добавляем:
'dop_img' => $dop_img,
Теперь в category.tpl меняем вывод картинки на :
<a class="dop_img" style="background:url(<?php echo $product['dop_img'][0];?>) no-repeat;" href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" /></a>
И правим css:
a.dop_img {
display:block;
}
a.dop_img:hover img {
opacity:0;
}

1.5.6.4

Сделал так. Не на всех товарах показывает второе изображение.

В чем проблема?

Надіслати
Поділитися на інших сайтах


Разобрался, в именах картинок были пробелы, а стиль прописывался без ковычек.

style="background:url(<?php echo $product['dop_img'][0];?>) no-repeat;"

style="background:url('<?php echo $product['dop_img'][0];?>') no-repeat;"

 

все работает! Спасибо!

Надіслати
Поділитися на інших сайтах


  • 3 weeks later...
  • 4 months later...
  • 1 month later...

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

Подскажите, как это внедрить в 1.5.6.1?

 

изменил файл /catalog/controller/product/category.php по аналогии с инструкцией для 1.5.4

 

это не понял как сделать:

Теперь в category.tpl меняем вывод картинки на :

И правим css:
 
Надіслати
Поділитися на інших сайтах


 

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

Подскажите, как это внедрить в 1.5.6.1?

 

изменил файл /catalog/controller/product/category.php по аналогии с инструкцией для 1.5.4

 

это не понял как сделать:

Теперь в category.tpl меняем вывод картинки на :

И правим css:
 

 

В catalog\view\theme\ТЕМА\template\product\catalog.tpl 

должна быть строчка вида типа <a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" /></a>

Ее нужно заменить на 

<a class="dop_img" style="background:url(<?php echo $product['dop_img'][0];?>) no-repeat;" href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" /></a>

 

По поводу правим в css. Тут нужно открыть catalog\view\theme\ТЕМА\stylesheet\stylesheet.css

В этом файле добавить следующий код, чтобы не ошибиться, смело копируйте в самый конец файла

 a.dop_img {

display:block;

}

a.dop_img:hover img {

opacity:0;

}

Змінено користувачем princesspoint
Надіслати
Поділитися на інших сайтах


В catalog\view\theme\ТЕМА\template\product\catalog.tpl 

должна быть строчка вида типа <a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" /></a>

Ее нужно заменить на 

<a class="dop_img" style="background:url(<?php echo $product['dop_img'][0];?>) no-repeat;" href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>" /></a>

 

По поводу правим в css. Тут нужно открыть catalog\view\theme\ТЕМА\stylesheet\stylesheet.css

В этом файле добавить следующий код, чтобы не ошибиться, смело копируйте в самый конец файла

 a.dop_img {

display:block;

}

a.dop_img:hover img {

opacity:0;

}

 

возникает ошибка на верху страницы: 

Notice: Undefined variable: result in /home/a19238/public_html/vqmod/vqcache/vq2-catalog_controller_product_category.php on line 243

замена картинки не работает.Просто моргает белым цветом.

 

Может быть замена не работает из за установленного модуля "Загрузка и сортировка картинок перетаскиванием opencart" ?

Надіслати
Поділитися на інших сайтах


  • 1 month later...

Ну короче сделал просто проверку на <?php if ($product['dop_img'][0]) { ?>

как именно?

Надіслати
Поділитися на інших сайтах


Первый способ:

...

P.S

Этот пример делал на OpenCart v1.4.9.6 скачанного с офф сайта...

извините за словоблудие, но просто не мог не восхититься 

данному пользователю жуткий + к карме

Змінено користувачем afwollis
Надіслати
Поділитися на інших сайтах


sl0wn, там все хорошо, но не хватает кода проверки, когда у товара всего одно фото, тогда при наведении просто пустота получается вместо фото :)
Надіслати
Поділитися на інших сайтах


Сделал для 2.1.0.1.1 по аналогии 1.5.4 и всё получилось в каталогах, товаре, модулях. Единственный модуль который не поддаётся, это рекомендуемые товары. Для всех выводимых товаров в модуле почему-то выводится одно стороннее дополнительное изображение а не принадлежащее к товару. Может кто-нибудь подсказать с этим вопросом?

Змінено користувачем emilbazilio
Надіслати
Поділитися на інших сайтах


  • 1 month later...
  • 8 months later...
  • 11 months later...
  • 4 weeks later...
  • 2 weeks later...
В 11/18/2017 в 19:24, qaz909 сказал:

Присоединяюсь к просьбе помочь реализовать, только еще на версию OPENCART.PRO 2.3.0.2.3 можно?

Если еще актуально.

additional_image_for2.3_v1.0.ocmod.xml

Надіслати
Поділитися на інших сайтах


В 28.11.2017 в 16:46, 7erj сказал:

Если еще актуально.

additional_image_for2.3_v1.0.ocmod.xml

Тут вот что выдает вверху при просмотре категории:

Спойлер

Notice: Undefined index: product_id in /home/********/public_html/system/storage/modification/catalog/controller/product/category.php on line 233

 

Надіслати
Поділитися на інших сайтах


  • 1 year later...
В 18.11.2017 в 20:24, qaz909 сказал:

Присоединяюсь к просьбе помочь реализовать, только еще на версию OPENCART.PRO 2.3.0.2.3 можно?

 

Есть такой модуль, выводит дополнительные картинки при наведении на основное изображение товара, на всех страницах сайта и во всех модулях.

Полностью совместим с Opencart.Pro !

 

Пример:

additional-hover-image-3product.gif.b75e309ede7092032bf139db7f8dd77d.gif

Надіслати
Поділитися на інших сайтах

Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку

×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.