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

[Oleg11]

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

[Tom]

ГДЕ!?

[Oleg11]

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

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

[baxabit]

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

 <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);

}

[wmzeshka]

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

 <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 ? тема не дефолтная

[Allaur]

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

[Tom]

https://opencartforum.com/files/file/595-%D1%88%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD-%D1%8D%D0%BB%D0%B5%D0%BA%D1%82%D1%80%D0%BE%D0%BD%D0%B8%D0%BA%D0%B0-%D0%B4%D0%BB%D1%8F-%D0%B6%D0%B8%D0%B7%D0%BD%D0%B8/

[Allaur]

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

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

Решено :-D