travelI'm on Holidays until the 22th august.

The questions posted during this period will receive no answer, so please be patient and wait before posting in the forum. Thank you

New registrations are suspended during this period

Je suis en vacances jusqu'au 22 aout.

Je ne répondrai à aucune question postée durant cette période. Merci d'attendre mon retour. Merci

Les inscriptions sur le site sont suspendues pendant cette période

 

Welcome, Guest
Username: Password: Remember me
  • Page:
  • 1

TOPIC: responsive Image Effect CK

responsive Image Effect CK 18 Dec 2020 14:42 #59074

  • Strider
  • Strider's Avatar Topic Author
  • Offline
  • Gold Boarder
  • Gold Boarder
  • Posts: 172
  • Thank you received: 2
Salut,

Je viens de voir le poste suivant, mais je n'ai pas tout compris.
forum.joomlack.fr/index.php/image-effect...mage-effect-ck#58925

Sur la maquette de mon site creationweb-site.fr/Evolution_architectu...dex.php/arch-projets

Je souhaite adapter le titre et l'image en fonction d'un smartphone ou d'une tablette. les images utilisent l'effet effectck-flip-left
Sur PC, cela fonctionne parfaitement, mais sur un iPhone par exemple, le texte est tronqué.

Merci d'avance.

Please Log in to join the conversation.

responsive Image Effect CK 19 Dec 2020 09:26 #59077

  • ced1870
  • ced1870's Avatar
  • Offline
  • Administrateur
  • Administrateur
  • Posts: 26633
  • Karma: 427
  • Thank you received: 3415
salut
en gros, tu utilises un code css avec media query (requete d'affichage) pour détecter la résolution de l'écran
@media screen and (max-width: 920px) {
	...
}
là tu choisis ta résolution (tu peux créer plusieurs règles dans ta page)
pour cibler ton effet, ensuite tu peux ajouter comme ceci
@media screen and (max-width: 920px) {
figure.imageeffectck figcaption {
    font-size: 1.5vw;
    padding: 0;
}
}
ça va réduire la taille du texte en dessous de 920px de largeur d'écran (à adapter). J'utilise ici l'unité "vw" pour que la police soit proportionnelle à la taille de l'écran
CEd
Joomlack Webmaster and Developer

Please Log in to join the conversation.

responsive Image Effect CK 19 Dec 2020 11:03 #59081

  • Strider
  • Strider's Avatar Topic Author
  • Offline
  • Gold Boarder
  • Gold Boarder
  • Posts: 172
  • Thank you received: 2
J'ai donc insérer le code que tu m'a fournis, je vois les modifications sur mon Samsung GS6. Maintenant il faut que je teste un iPhone et un iPad. Je te dirais ce que cela donne. Merci pour tes explications.

Please Log in to join the conversation.

  • Page:
  • 1
Time to create page: 0.207 seconds

Fast and powerful creation, customizable and responsive.

Read More

Qui est en ligne

We have 375 guests and no members online