- Posts: 22
- Thank you received: 1
la photo de fiche produit : transformer le curseur en loupe
7 years 2 weeks ago - 7 years 2 weeks ago #311017
by Valserine
-- HikaShop version -- : 4.2.1
-- Joomla version -- : 3.9.11
-- PHP version -- : 7.3.9
Bonjour,
Je découvre hikashop depuis une dizaine de jours pour ma boutique en ligne. je trouve presque toutes les infos qu'il me faut grâce à vos divers forums. N'ayant pas trouvé pour cette question la voici :
j'aimerais que la main qui sert de curseur sur ma photo de produit (quand on est dans le show-bloc-img) soit une petite loupe genre celle avec un +.
Il me semble qu'ainsi les visiteurs comprendraient mieux qu'ils doivent cliquer sur l'image pour la voir agrandie.
J'ai cherché dans l'affichage "vues" du bloc-img mais c'est un peu trop touffu.. pour moi...
Pourriez vous m'indiquer quelles lignes de code génèrent cette fonction ?
Merci d'effacer ce message pour la 2me fois je ne l'ai pas mis dans la bonne section
-- Joomla version -- : 3.9.11
-- PHP version -- : 7.3.9
Bonjour,
Je découvre hikashop depuis une dizaine de jours pour ma boutique en ligne. je trouve presque toutes les infos qu'il me faut grâce à vos divers forums. N'ayant pas trouvé pour cette question la voici :
j'aimerais que la main qui sert de curseur sur ma photo de produit (quand on est dans le show-bloc-img) soit une petite loupe genre celle avec un +.
Il me semble qu'ainsi les visiteurs comprendraient mieux qu'ils doivent cliquer sur l'image pour la voir agrandie.
J'ai cherché dans l'affichage "vues" du bloc-img mais c'est un peu trop touffu.. pour moi...
Pourriez vous m'indiquer quelles lignes de code génèrent cette fonction ?
Merci d'effacer ce message pour la 2me fois je ne l'ai pas mis dans la bonne section
Last edit: 7 years 2 weeks ago by Valserine. Reason: asking to erase this second edition of the same post, still not in the right area of the forum
Please Log in or Create an account to join the conversation.
7 years 2 weeks ago #311022
by nicolas
Replied by nicolas on topic la photo de fiche produit : transformer le curseur en loupe
Bonjour,
Pas de code PHP à changer. Il suffit de rajouter un peu de CSS pour cela:
www.hikashop.com/support/documentation/1...ize-the-display.html
Pas de code PHP à changer. Il suffit de rajouter un peu de CSS pour cela:
Code:
.hikashop_product_main_image_subdiv a {
cursor: zoom-in;
}
Please Log in or Create an account to join the conversation.
7 years 2 weeks ago #311044
by Valserine
Replied by Valserine on topic la photo de fiche produit : transformer le curseur en loupe
Bonjour,
en examinant le front-end custom css je trouve ceci :
}
.hikashop_product_image .hikashop_product_image_subdiv,
.hk_product_image .hk_subdiv {
position: relative;
text-align: center;
clear: both;
margin: auto;
}
est-ce bien dans ce bloc que je dois insérer le cursor: zoom-in; ?
en examinant le front-end custom css je trouve ceci :
}
.hikashop_product_image .hikashop_product_image_subdiv,
.hk_product_image .hk_subdiv {
position: relative;
text-align: center;
clear: both;
margin: auto;
}
est-ce bien dans ce bloc que je dois insérer le cursor: zoom-in; ?
Please Log in or Create an account to join the conversation.
7 years 2 weeks ago #311058
by Valserine
Replied by Valserine on topic la photo de fiche produit : transformer le curseur en loupe
rebonjour,
j'ai donc inclus le code donné par Nicolas dans le bloc montré dans mon message précédent. et ça marche !!
certes seulement pour l'image principale mais c'est déjà super !
merci Nicolas !
j'ai donc inclus le code donné par Nicolas dans le bloc montré dans mon message précédent. et ça marche !!
certes seulement pour l'image principale mais c'est déjà super !
merci Nicolas !
Please Log in or Create an account to join the conversation.
7 years 1 week ago #311061
by Philip
Replied by Philip on topic la photo de fiche produit : transformer le curseur en loupe
Bonjour,
Vous pouvez pour avoir le même effet sur les autres images (sous-images) en multipliant les commandes Css.
Pour trouver facilement les class des éléments html pour votre selector de css , mettez votre souris dessus, puis clique-droit => inspecter (ou inspector tool ou inspect element), un fenêtre s'ouvrira pour afficher l'Html vous permettant de voir la class de l'élément html.
Cordialement
Vous pouvez pour avoir le même effet sur les autres images (sous-images) en multipliant les commandes Css.
Pour trouver facilement les class des éléments html pour votre selector de css , mettez votre souris dessus, puis clique-droit => inspecter (ou inspector tool ou inspect element), un fenêtre s'ouvrira pour afficher l'Html vous permettant de voir la class de l'élément html.
Cordialement
Please Log in or Create an account to join the conversation.
7 years 1 week ago #311156
by Valserine
Replied by Valserine on topic la photo de fiche produit : transformer le curseur en loupe
Merci Philip,
pour l'instant j'ai décidé de laisser le curseur loupe seulement sur l'image principale, et ça le fait bien...
d'autant que j'ai plein d'autres paramètres à potasser pour tirer le meilleur d'hikashop, qui est top je trouve. (je viens de virtuemart et quand ça change, ça change !!)
bon week-end
pour l'instant j'ai décidé de laisser le curseur loupe seulement sur l'image principale, et ça le fait bien...
d'autant que j'ai plein d'autres paramètres à potasser pour tirer le meilleur d'hikashop, qui est top je trouve. (je viens de virtuemart et quand ça change, ça change !!)
bon week-end
Please Log in or Create an account to join the conversation.
Time to create page: 0.225 seconds