Les images de l'article dans la lightbox sont à 100% de width

eddy
Topic Author
Visitor

6 years 9 months ago - 6 years 9 months ago #4864 by eddy

Les images de l'article dans la lightbox sont à 100% de width was created by eddy

J'ai configuré dans le gestionnaire de place pour la lightbox pour ouvrir un article quand le marqueur de lieu est cliqué.

Cette fonction fonctionne bien sauf que les images de l'article sont redimensionnées à 100% de la largeur de la lightbox même lorsque les dimensions de l'image sont définies manuellement dans le code de l'article.

Comment puis-je obtenir ces images à la taille de l'image originale?

Je souhaite que l'adresse web reste privée. Je peux vous envoyer l'URL de la map et de l'article via le formulaire de contact si vous le souhaitez.

Merci pour cet excellent Joomla addon!

Et désolé mon français est pauvre

Last edit: 6 years 9 months ago by eddy. Reason: erreurs de traduction

The topic has been locked.

gmapfp
Offline
Moderator

6 years 9 months ago #4865 by gmapfp

Replied by gmapfp on topic Les images de l'article dans la lightbox sont à 100% de width

Bonjour,

Envoyer moi le lien par le formulaire de contact.

The following user(s) said Thank You: eddy

The topic has been locked.

eddy
Topic Author
Visitor

6 years 9 months ago #4866 by eddy

Replied by eddy on topic Les images de l'article dans la lightbox sont à 100% de width

Merci pour la réponse rapide.

Je vous ai envoyé les URL de la map et l'article qui est affiché dans la lightbox via le formulaire de contact

Les avez-vous reçus?

The topic has been locked.

gmapfp
Offline
Moderator

6 years 9 months ago #4867 by gmapfp

Replied by gmapfp on topic Les images de l'article dans la lightbox sont à 100% de width

Bonjour,

Essaye d'ajouter dans le CSS:

#sbox-content article img {
width : initial !important;
}

The following user(s) said Thank You: eddy

The topic has been locked.

eddy
Topic Author
Visitor

6 years 9 months ago - 6 years 9 months ago #4868 by eddy

Replied by eddy on topic Les images de l'article dans la lightbox sont à 100% de width

Après avoir ajouté le code via l'éditeur CSS de GMapFP, je peux voir qu'il est outrepasser par le fichier CSS du thème de l'modèle, donc cela ne fonctionne pas pour le site.

La solution que j'ai trouvée consistait à remplacer tous l'image styles de largeur avec...

auto !important

dans le fichier custom.css pour l'modèle.

Si j'ai ajouté...

width: initial !important;

certains images peuvent ne pas être réactives et redimensionner si nécessaire.

J'ai ajouté le code suivant au fichier custom.css pour mon modèle afin d'obtenir le résultat souhaité:

/ * GMAPFP LIGHTBOX ARTICLE IMAGE TAILLE * /

article img,
.article-intro img {
  display: block;
  max-width: auto !important;
  height: auto;
}

article img[align="left"],
.article-intro img[align="left"],
article .img-fulltext-left,
.article-intro .img-fulltext-left,
article .img-intro-left,
.article-intro .img-intro-left,
article .img_caption.left,
.article-intro .img_caption.left,
article .pull-left.item-image,
.article-intro .pull-left.item-image {
  margin-right: 20px;
  max-width: auto !important;
}

article img[align="right"],
.article-intro img[align="right"],
article .img-fulltext-right,
.article-intro .img-fulltext-right,
article .img_caption.right,
.article-intro .img_caption.right,
article .img-intro-right,
.article-intro .img-intro-right,
article .pull-right.item-image,
.article-intro .pull-right.item-image {
  margin-left: 20px;
  max-width: auto !important;
}

.img-intro-none,
.img-intro-left,
.img-intro-right,
.img-fulltext-none,
.img-fulltext-left,
.img-fulltext-right,
.img_caption {
  position: relative;
  margin-bottom: 20px;
  max-width: auto !important;
} 

@media screen and (max-width: 992px) {
  article img,
  .article-intro img,
  article img[align=left],
  .article-intro img[align=left],
  article img[align=right],
  .article-intro img[align=right],
  article .img_caption,
  .article-intro .img_caption,
  article .article-image-full,
  .article-intro .article-image-full,
  article .article-image-intro,
  .article-intro .article-image-intro,
  article .img-intro-none,
  .article-intro .img-intro-none,
  article .img-intro-left,
  .article-intro .img-intro-left,
  article .img-intro-right,
  .article-intro .img-intro-right,
  article .img-fulltext-none,
  .article-intro .img-fulltext-none,
  article .img-fulltext-left,
  .article-intro .img-fulltext-left,
  article .img-fulltext-right,
  .article-intro .img-fulltext-right {
    float: none !important;
    margin-left: 0;
    margin-right: 0;
    width: auto !important;
  }
}

Avec cette information, pouvez-vous trouver une meilleure façon de mettre en œuvre une solution?

Merci encore!

Last edit: 6 years 9 months ago by eddy. Reason: erreurs de traduction

The topic has been locked.

gmapfp
Offline
Moderator

6 years 9 months ago #4869 by gmapfp

Replied by gmapfp on topic Les images de l'article dans la lightbox sont à 100% de width

Bonjour,

Afin que ce code ne soit pas outrepassé par le CSS de ton modèle, je te conseil de le collé dans le CSS de ton modèle après les lignes qui l'outrepasse.

The topic has been locked.

Time to create page: 0.152 seconds

FaLang translation system by Faboba

Please help support our site and work on Joomla extensions.
Amount :

Thank you !

Les images de l'article dans la lightbox sont à 100% de width

The latest news