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

[Conan le Babar]

[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 October 19, 2018 by Conan le Babar (see edit history)

[Performance Agency]

Bonjour,

Dans ton CSS quelque chose du style :

body{

background-image: url(/img.jpg);

background-position:fixed;

}

[Conan le Babar]

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.

 

 

[Mediacom87]

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.

[Conan le Babar]

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