Image en "background fullwidth" > page detail produit

[clem97410]

Bonjour,

 

Actuellement en pleine intégration, je cherche à modifier un thème prestashop et plus particulièrement la fiche produit pour avoir l'image du produit en full width, (comme sur Archiduchesse ) avec la description du produit à droite "par dessus".

 

Après avoir recherché un peu partout sur le web, j'ai lu qu'il fallait avoir 2 photos produit, une pour la couverture et une "full" pour la page detail de produit.

 

J'ai lu qu'il fallait modifier le fichier "product.tpl" etc mais je n'ai pas vraiment de connaissances en smarty.. et avec un jeune dev stagiaire on a essayé toute la journée d'hier pour trouver la solution, en vain 

 

D'avance merci,

 

Clément

 

 

 

[math_php]

Bonjour,

 

En fait il faut 'juste' :

- en css définir comme fond de la div produit, l'image en grande taille du produit

- programmer en jquery, le fait de survoler l'image timbre poste pour remplacer l'image de fond de la div produit.

 

Sinon c'est vrai que c'est clean et que ça présente bien.

 

Cordialement

[clem97410]

Bonjour et merci de votre réponse,

 

Je suis désolé mais malheureusement je ne vois pas trop comment faire car le jquery je ne connais pas vraiment.. 

 

Ceci dit pour la partie CSS, comment définir à chaque fois que la 2ème photo du produit (la "full" en 1170x580) viennent en "background" du container?  (car la 1ere carré en 800x800 est pour la couverture) 

 

 Merci encore, cordialement

[math_php]

Pour le Jquery voici une piste :

 

 

$('#image-block').on('mouseenter',function(){
  var src=$('#bigpic').attr('src');
  $('#primary_block').css('background-image','url('+src+')');
 
});
$('#image-block').on('mouseleave',function(){
  $('#primary_block').css('background-image','url()');
 
});

 

Au survol de l'image produit, la div produit reçoit l'image de fond. C'est juste un exemple, mais c'est une bonne base de départ.

[clem97410]

Merci beaucoup, je vais bosser un peu tout ça