Перейти к публикации
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...

Как сделать, чтоб при наведении на товар фото увеличилось?


 Поделиться

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

к примеру в модуле рекомендуем (Version 1.5.3.1) при наведении мыши на товар фото с товаром увеличилось.

пример http://demosait85.16mb.com/

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


  • 2 недели спустя...

не вижу я тут увеличение фото. блока и фото - да.

 <div>
   <div class="name">
    <a href="http://demosait85.16mb.com/index.php?route=product/product&product_id=42">Apple Cinema 30"</a></div>
      <div class="image">
         <div class="special"><img src="/image/special.png" /></div> 
            <a href="http://demosait85.16mb.com/index.php?route=product/product&product_id=42" onmouseover="javascript:photoOnLeft('http://demosait85.16mb.com/image/cache/data/1-260x260.jpg', event);" onmousemove="photoMoveLeft(event);" onmouseout="javascript:photoOffLeft();"><img src="http://demosait85.16mb.com/image/cache/data/1-140x140.jpg" alt="Apple Cinema 30"" /></a>
     </a>                         
 </div>
demosait85.16mb.com/catalog/view/javascript/hover-image-left.js

// При наведении на объект

function photoOnLeft(ell, e){

var newDivPh = document.createElement('div');

document.body.appendChild(newDivPh);

newDivPh.id = 'newDivPh';

var newImg = document.createElement('img');

newDivPh.appendChild(newImg);

newImg.setAttribute('alt', '');

newImg.setAttribute('src', ell);

newImg.id = 'newImg';

var event = (window.event) ? window.event : e;

newDivPh.style.top = (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop)-305 + 'px';

newDivPh.style.left = (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft)+15 + 'px';

}

// При движении по объекту

function photoMoveLeft(e){

var newDivPh = document.getElementById('newDivPh');

var event = (window.event) ? window.event : e;

newDivPh.style.top = (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop)-305 + 'px';

newDivPh.style.left = (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft)+15 + 'px';

}

// При убирании курсора с объекта

function photoOffLeft(){

var newDivPh = document.getElementById('newDivPh');

newDivPh.parentNode.removeChild(newDivPh);

}

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


  • 3 месяца спустя...

не вижу я тут увеличение фото. блока и фото - да.

 <div>
   <div class="name">
    <a href="http://demosait85.16mb.com/index.php?route=product/product&product_id=42">Apple Cinema 30"</a></div>
      <div class="image">
         <div class="special"><img src="/image/special.png" /></div> 
            <a href="http://demosait85.16mb.com/index.php?route=product/product&product_id=42" onmouseover="javascript:photoOnLeft('http://demosait85.16mb.com/image/cache/data/1-260x260.jpg', event);" onmousemove="photoMoveLeft(event);" onmouseout="javascript:photoOffLeft();"><img src="http://demosait85.16mb.com/image/cache/data/1-140x140.jpg" alt="Apple Cinema 30"" /></a>
     </a>                         
 </div>
demosait85.16mb.com/catalog/view/javascript/hover-image-left.js

// При наведении на объект

function photoOnLeft(ell, e){

var newDivPh = document.createElement('div');

document.body.appendChild(newDivPh);

newDivPh.id = 'newDivPh';

var newImg = document.createElement('img');

newDivPh.appendChild(newImg);

newImg.setAttribute('alt', '');

newImg.setAttribute('src', ell);

newImg.id = 'newImg';

var event = (window.event) ? window.event : e;

newDivPh.style.top = (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop)-305 + 'px';

newDivPh.style.left = (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft)+15 + 'px';

}

// При движении по объекту

function photoMoveLeft(e){

var newDivPh = document.getElementById('newDivPh');

var event = (window.event) ? window.event : e;

newDivPh.style.top = (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop)-305 + 'px';

newDivPh.style.left = (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft)+15 + 'px';

}

// При убирании курсора с объекта

function photoOffLeft(){

var newDivPh = document.getElementById('newDivPh');

newDivPh.parentNode.removeChild(newDivPh);

}

 

Скажите пожалуйста, вы сможете это реализовать на ocstore 1,5,4,1,2 ? тема не дефолтная

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


  • 4 недели спустя...

 Тоже интересует реализация данного рродукта

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


со знаниями html  и css можно всё выдрать из демки :-)

Какой смысл покупать весь шаблон за 650р

Решено :-D

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


Создайте аккаунт или войдите в него для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас
 Поделиться

  • Сейчас на странице   0 пользователей

    • Нет пользователей, просматривающих эту страницу.
×
×
  • Создать...

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

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