Taille photo
Author: PapyMaz ..Bonjour,
Le problème : photo OK sur écran d'ordinateur mais la taille ne va plus sur smartphone ?
SUr ma page d'accueil, je souhaite modifier la taille d'une photo j'ai donc sur deux lignes différentes avec la "cellule" image j'ai installé ma photo avec une taille différente* sur chacune des lignes puis j'ai "élargi" les deux lignes puisque je veux que les photos prennent la largeur de l'écran.
Jusqu'à une certaine taille avec "montrer cacher" j'ai caché une des deux lignes, et sur les tailles inférieures je souhaite faire l'inverse montrer la ligne qui était cacher et cacher celle qui était visible.
Cela semble impossible avec "montrer cacher" Existe t-il une autre solution ????
* moins rognée pour celle du smartphone.
Toute aide est la bienvenue. Merci
Salut Papy,
On peut avoir l'URL du site pour tester si le projet est en ligne ? As-tu tenté de mettre la photo depuis le style des lignes pour voir ce que ça peut donner ?
Sinon copie écran de ton projet en prévisu (grande taille, puis taille réduite), et image en question en pièce jointe qu'on puisse la tester...
@Suivre,
J.P.
Author
Salut JiPer
Merci pour ton retour,
www.visitedeparis.com
Sur smartphone j'aimerai avoir une autre photo que celle que l'on voit sur un écran d'ordinateur.
Je ne vois pas ce que tu veux dire par "style des lignes"
Merci
Re... Avec plaisir !
Pour le style de lignes, un peu de lecture :
https://guide.websitex5.com/en/support/solutions/articles/44001697155-how-to-work-on-the-row-formats-to-create-a-horizontal-band-displaying-a-background-color-or-image
Tu ouvres ta page de travail, puis tu vas sur :
Et tu testes les différentes possibilités...
Je regarde ton projet pour voir ce que ça donne, et je reviens dès que possible.
@+,
J.P.
Suite...
Désolé Papy, mais je n'arrive pas à faire quelque chose d'intéressant en suivant ton idée...
Je me demande s'il n'est pas plutôt souhaitable (?) de jongler avec les images en question depuis le contenu du modèle dans chaque définition du projet ? (en adaptant la taille des images sur les zones disponibles).
Laisse le sujet ouvert et attendons de voir si quelqu'un peut proposer une solution.
PS - A toutes fins utiles :
Sur mon smartphone l'image de l'Arc de Triomphe est bien affichée dans son intégralité et correspond parfaitement à ce que je vois sur le grand écran du PC fixe.
@+,
J.P.
Author
Merci pour ton retour,
Sans doute les effets de l'age mais j'utilise bien "style de ligne" mais je n'ai pas trouvé de solution par ce biais.
J'ai également (sans doute) le même résultat que toi sur mon smartphone. Sur un plan esthétique je trouve la photo de l'Arc de Triomphe un peu écrasée sur le téléphone voila pourquoi il est dommage de ne pouvoir choisir via "montrer cacher" la photo la mieux adaptée en fonstion de la taille de l'écran.
Je suis ton conseil je ne ferme pas le sujet...
Encore merci et bonne soirée.
PapyMaz.
... je n'ai pas compris quelle image tu veux différencier entre PC et smartphone ...
... dans le cas d'arrière-plans, le code EXTRA doit être utilisé ..
... pour les autres objets, vous pouvez toujours faire avec du code EXTRA, un seul objet dans l'unique cellule d'une rangée, et l'autre objet dans l'unique cellule de la rangée en dessous...
... si ça vous intéresse, ne cachez pas les deux objets dans ces lignes, et dites-moi lequel vous voulez voir sur le PC et lequel sur le Smartphone...
.
ciao
.
Author
Pour une raison esthétique, je souhaite changer la photo de l'arc de Triomphe sur la page d'accueil pour mettre une photo (même photo de l'arc de Triomphe mais moins rognée en hauteur sur logiciel photo) pour le format écran smartphone.
Pas facile à expliquer....
Merci.
Author
Ou plus simplement :
- ligne 2 visible pour les grands écrans jusqu'à 720px
- ligne 3 visible pour les écrans plus petits à partir de 720px
Merci pour l'aide.
(It > Fr) ... Je ne vois pas de lignes séparées ...
... bref, pour la mise en page actuelle, en attendant essayez ce code, collez dans le panneau Expert > 3ème option (/HEAD) ...
... alors vous remplacerez l'image pixabay par la vôtre:
<style>
@media (max-width:719px) { #imObjectImage_232_container::after {
content: url("https://cdn.pixabay.com/photo/2017/01/31/22/55/bank-2027944__340.jpg");}
#imObjectImage_232_container {text-align:center;}
#imObjectImage_232_container img {display:none}
#imCell_232, #imCell_232 div {width:100%} }
</style>
... éventuellement vous pouvez aussi utiliser mes autres codes, toujours simples...
.
ciao
.
Author
Bonjour, et merci pour le retour,
Je me suis sans doute mal expliqué, dans le doute, je viens de faire une copie écran avec explications.
Il semble qu'il ne soit pas possible dans "adaptatif " de cacher ou montrer une rangée selon la taille de l'écran ?
@ suivre...
PapyMaz
(It > Fr) ... ciao, ... le code précédent est lié au grand Arc de Triomphe en haut, qui est remplacé en dessous des 720 pixels ...
... maintenant à évaluer sur cette page > www.visitedeparis.com(!) Je ne vois pas les deux lignes distinctes auxquelles vous faites référence
... ou il faut me mettre le LIEN de la page HTML où il y a ces deux lignes visibles, pour que je puisse vérifier pour appliquer mon code EXTRA(!)...
... quand vous pourrez me prévenir ...
ciao
.
Author
Merci.
La dernière mise à jour à permis à mon site de très bien fonctionner.
... OK ... ciao