Jump to content
Conan le Babar

[RESOLU] Le Prestashop 1.6 de Conan - Glissement vertical de la boutique sur un fond fixe. Possible ?

Recommended Posts

[RESOLU] [SOLVED]

 

 

Bonjour. Cette question touche à un paramètre purement esthétique. Je recherche à faire en sorte que ma boutique puisse avoir un corps principal mobile vers le haut ou le bas ( le mouvement classique de la souris, quoi. ) mais tout cela sur un background qui reste fixe.

 

J'avais déjà testé cette fonction implémentée nativement sur un thème prestashop 1.3.7 en 2012, donc je sais ( et humblement, je pense... ) que c'est re-faisable sur une version 1.6

 

Ainsi, que dois-je chercher à modifier ? css ou tpl ? Et à quoi ressemble la portion de code ?

Merci pour votre participation. A bientôt.

 

Pour info :

- Version exacte du prestashop : 1.6.1.15

- Date d'installation : Octobre 2018

- Mises à jour bloquées pour que cette version reste une 1.6.1.15 100% d'origine.

- Ajout et adaptation visuelle du thème zKid de Zerocarts

- Aucune modification sur le thème default-bootstrap

- Mon prestashop est hébergé en localhost. Mais je peux fournir des captures d'écran si besoin. No problem !

- Plateforme de travail : Linux Debian 9 64 bits - Geany - Xampp - Firefox 61.0.2

Edited by Conan le Babar (see edit history)

Share this post


Link to post
Share on other sites

Bonjour Performance_Agency.

Alors, pour faire simple, la portion exacte de code que tu m'as proposé ne fonctionne pas. Notamment "backgroud-position:fixed;" est totalement inopérante dans plusieurs associations avec "background-image: url(/img.jpg)".

Toutefois, j'ai trouvé la solution avec une variante de l'ensemble dont voici le code exact :

body,#header {background: url(../img/bg.jpg) fixed!important;}

"fixed" est simplement ajouté sans "background-position:" et là, effectivement mon fond devient fixe et la boutique mouvante.

 

NB : A l'attention de ceux qui voudraient recopier le code pour s'en servir, remplacez (../img/bg.jpg) par votre url à vous, bien entendu !

 

Merci pour la proposition de cette piste qui finalement m'a amené a dénicher la bonne syntaxe. ;-)

Le sujet est résolu.

 

 

Share this post


Link to post
Share on other sites
il y a 13 minutes, Conan le Babar a dit :

amené a dénicher la bonne syntaxe. ;-)

La syntaxe proposé était parfaite aussi, vous avez juste utilisez la version raccourcie, moins explicite pour les néophytes en y ajoutant un !important pour forcer à utiliser votre modification quelque soit les modification futures, ce qui risque à terme de provoquer de petits soucis pour une quelconque modification.

Sinon, vous appliquez cela à body et à #header, donc vous allez afficher 2 fois la même image sur votre site sur 2 éléments différents, je ne suis pas bien certain que cela soit très cohérent, mais n'ayant pas regardé votre site, je n'ai pas de jugement à porter, juste à attirer votre attention.

Share this post


Link to post
Share on other sites

Bonjour Mediacom87.

Ha bon, je ne savais pas qu'une de ces deux syntaxes était le raccourci de l'autre. Merci pour l'info. Par contre pour "!important" il était déjà là dans le css. ce n'est absolument pas moi qui en suis l'auteur. D'ailleurs, je ne sais même pas à quoi cela peut bien servir, même si j'ai remarqué ce "!important" pas mal de fois dans les css du thème.

A l'origine, le code était celui-là (issu du backup, donc c'est vraiment l'original) :

body,#header {background: url(../img/bg.jpg)!important;}

Et moi, je n'ai juste qu'ajouté le "fixed" comme ceci :

body,#header {background: url(../img/bg.jpg) fixed!important;}

 

Dois-je finalement retirer le "!important" ?

En tous les cas, merci d'avoir attiré mon attention sur ce fait. ;-)

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More