Traiter la variable d'un javascript

[photoclic]

Dans le javascript ci-dessous qui permet de numéroter les images, je souhaiterais centrer la variable "M14_IMG" et lui affecter une couleur et une taille de caractère. Je ne sais comment m'y prendre.
Merci pour votre aide.

Code:

$(function(){
          var M14_IMG = 1;
    $('.postbody .content img[src*="servimg.com"]').each(function() {
    $(this).before (M14_IMG+'<br />').after('<br />');
      M14_IMG ++;
  });
        });   



[photoclic]

Up

[kawarz]

Bonjour,
pourriez vous poster une capture d'écran de votre problème et faire un schéma de ce que vous aimeriez avoir?

[photoclic]

Bonjour Kawarz et merci pour ton aide.

Ci-dessous une capture d'écran où l'on voit le n° de l'image qui se positionne à gauche de l'image et non centré sur l'image.

Spoiler:

[kawarz]

Pouvez vous essayer ceci? Mes compétences en javascript sont assez maigres cependant:

Code:

$(function(){
          var M14_IMG = 1;
    $('.postbody .content img[src*="servimg.com"]').each(function() {
    $(this).before ('<center>'+M14_IMG+'</center>').after('<br />');
      M14_IMG ++;
  });
        }); 
 

[photoclic]

Pas maigres du tout tes compétences kawarz. C'est tout bon.

Il ne me reste plus qu'à centrer les exifs au dessus des photos.
J'utilise actuellement le code suivant mais le width décale mais ne centre pas les exifs.
Si tu as une idée.

Code:

exif:before {
   display: table-cell;
        vertical-align: middle;
       
    font-size:15px;
    color: #6B6B6B;
    font-weight: bold;
        content: "";
      width: 20%;
       
    }

[kawarz]

vous auriez un lien accessible aux invités où il y a des exif?

[photoclic]

J'ai un code destiné aux aidants que je vous transmets.

[kawarz]

tentez de retirer le before que vous m'avez donné plus haut et essayez ceci:

Code:

.info-exif{
text-align:center;
}

[photoclic]

j'ai retiré tout le code exif:before { .....}

Le code avec text-align:center ne fonctionne pas.

Je mets ci-dessous tout le css correspondant aux exifs:

Code:

  /*Affichage Exif*/

#exif:not(:first-child) {
   margin-top: 40px;
       }
   
#exif {
         display: table;
       }

#exif:before {
   display: table-cell;
        vertical-align: middle;
       
    font-size:15px;
    color: #6B6B6B;
    font-weight: bold;
        content: "";
      width: 20%;
    }

 
#exif:first-child:before {
       font-size: 0px;
       }

    .info-exif tr td:first-child:after {
        content: ":";
       }

.info-exif tr:not(:last-child):after {
     font-size:12px;
       color: #616161;
        content: "|";
       }

.info-exif tr {
     font-size:12px;
       color: #616161;
       display: inline-table;
      }
   

[kawarz]

Etrange...Vous pourriez tenter comme ceci?

Code:



/*Affichage Exif*/
#exif:not(:first-child)
{
   margin-top: 40px;
}

#exif
{
   display: block;
}

#exif:first-child:before
{
   font-size: 0px;
}

.info-exif tr td:first-child:after
{
   content: ":";
}

.info-exif tr:not(:last-child):after
{
   font-size:12px;
   color: #616161;
   content: "|";
}

.info-exif tr
{
   font-size:12px;
   color: #616161;
   display: inline-table;
}

.info-exif
{
   text-align:center;
}
.info-exif table
{
   width:auto !important;
        display:inline !important;
}

[photoclic]

Un grand merci kawarz, superbe.
C'est tout bon

je vais essayer de comprendre le pourquoi du comment.

Je passe en résolu.