Alignement de la liste des images pour le Profil

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Alignement de la liste des images pour le Profil

Message par Hirakyo152 le Jeu 11 Fév 2016 - 2:44

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Autre
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Toujours
Lien du forum : http://kaminoakuma-elsword.forumactif.org/

Description du problème


Bonjour,

Est-ce qu'il est possible de faire en sorte que l'on puisse faire un alignement de la liste des images pour le Profil ? Voici un exemple de ce que je souhaite avoir Mad :



Je ne sais pas du tout si vous allez pouvoir comprendre ça ! Razz

Merci en avance pour votre aide =)


Dernière édition par Hirakyo152 le Ven 12 Fév 2016 - 20:45, édité 1 fois

Hirakyo152
**

Masculin
Messages : 86
Inscrit(e) le : 17/01/2016

http://kaminoakuma.forumactif.org/
Hirakyo152 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Hirakyo152 le Ven 12 Fév 2016 - 13:20

Bonjour,

UP ! Very Happy

Est-ce que c'est possible de le faire ? Sachant que moi, j'ai beau chercher... mais j'ai trouvé aucune astuce pour ça... :'(

Hirakyo152
**

Masculin
Messages : 86
Inscrit(e) le : 17/01/2016

http://kaminoakuma.forumactif.org/
Hirakyo152 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Musara le Ven 12 Fév 2016 - 18:14

Salut Hirakyo !

J'ai codé une solution relativement simple en Javascript qui devrait fonctionner chez toi aussi.

Code:
$(function(){

   $('#profile_field_16_-7').after('<div class="musa-profile-field-list"></div>');
   
   $('.musa-profile-field-list').append($('#profile_field_16_-7 label'));
   
   $('#profile_field_16_-7').remove();

});

Cependant il faut remplacer l'identifiant "#profile_field_16_-7" (qui correspond à l'endroit où je testais le code chez moi) par ce que tu veux.

Pourrais-tu récupérer l'identifiant du champ du profil concerné chez toi ?

Pour ce faire : clic droit sur la première des images que tu veux aligner et clique sur "Inspecter" dans le menu déroulant (si tu utilises Chrome). Tu devrais voir apparaitre plein de code qui ressemble environ à ça :

Code:
<ul id="quelque_chose" class="profile_field_list">
    <li>
        <label></label>
    </li>
    <li></li>
    <li></li>
    ...

C'est le id="quelque_chose" qui nous intéresse ici !

Une fois que tu l'auras trouvé je pourrai t'expliquer comment ajouter le code mentionné plus haut.

Et si jamais tu ne trouves pas / si jamais ça ne ressemble pas à ce que j'ai dit, n'hésite pas !

Musara
**

Masculin
Messages : 50
Inscrit(e) le : 02/01/2016

http://musaraignes.forumactif.fr/
Musara a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Hirakyo152 le Ven 12 Fév 2016 - 18:51

Bonjour,

J'ai effectué ce que vous m'avez dit de faire... voici le code JavaScript que j'ai modifié :

Code:
$(function(){
 
   $('#profile_field_8_4').after('<div class="profile_field_list"></div>');
  
   $('.profile_field_list').append($('#profile_field_8_4 label'));
  
   $('#profile_field_8_4').remove();
 
});

Placement: Sur toutes les pages


Sauf que mon problème actuel, c'est ça :


Il y a un alignement qui se produit en double :/
(J'aimerai retirer ceux qui sont dans la partie : "Sexe" et "Navigateur internet")

PS : Je possède Comodo Dragon, comme navigateur qui est similaire à Google Chrome.

Hirakyo152
**

Masculin
Messages : 86
Inscrit(e) le : 17/01/2016

http://kaminoakuma.forumactif.org/
Hirakyo152 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Musara le Ven 12 Fév 2016 - 19:15

Salut Hirakyo !

Yes bien joué, c'est exactement ce qu'il fallait faire. Ton problème vient de la classe ".profile_field_list" que tu as utilisée dans le code Javascript. Donne lui un nom perso comme j'avais fait ".musa-profile-field-list" par exemple. Tu peux mettre ce que tu veux sauf une classe déjà utilisée comme ".profile_field_list".

En espérant que ça corrige le souci !

Musara
**

Masculin
Messages : 50
Inscrit(e) le : 02/01/2016

http://musaraignes.forumactif.fr/
Musara a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Hirakyo152 le Ven 12 Fév 2016 - 19:23

Ça fonctionne à merveille, merci beaucoup Wink 
Désormais, j'aimerai faire quelque chose de plus représentant... 
comme par exemple, faire en sorte qu'il y a 3 images par ligne, c'est possible ? 

Par exemple: 

  

  

  

Hirakyo152
**

Masculin
Messages : 86
Inscrit(e) le : 17/01/2016

http://kaminoakuma.forumactif.org/
Hirakyo152 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Musara le Ven 12 Fév 2016 - 19:37

Ouais ça me parait tout à fait faisable.

Essaye ce code :

Code:
$(function(){

   $('#profile_field_8_4').after('<div class="profile-field-list-perso"></div>');
   
   $('.profile-field-list-perso').append($('#profile_field_8_4 label'));
   
   $('#profile_field_8_4').remove();
   
   $('.profile-field-list-perso label:nth-child(3n+3)').after('<br />');

});

Je ne l'ai pas testé alors croisons les doigts x)

Musara
**

Masculin
Messages : 50
Inscrit(e) le : 02/01/2016

http://musaraignes.forumactif.fr/
Musara a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Hirakyo152 le Ven 12 Fév 2016 - 20:06

Merci bien, ça fonctionne parfaitement Smile



Est-ce que c'est possible de faire en sorte que ma avant-dernière image rejoigne ma dernière image ? 
Histoire de faire en sorte qu'elle ne se retrouve pas toute seule en dernière ?

Hirakyo152
**

Masculin
Messages : 86
Inscrit(e) le : 17/01/2016

http://kaminoakuma.forumactif.org/
Hirakyo152 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Musara le Ven 12 Fév 2016 - 20:35

Ouais, un truc un peu moins joli dans ce genre là devrait faire l'affaire :

Code:
$(function(){

   $('#profile_field_8_4').after('<div class="profile-field-list-perso"></div>');
   
   $('.profile-field-list-perso').append($('#profile_field_8_4 label'));
   
   $('#profile_field_8_4').remove();
   
   $('.profile-field-list-perso label:nth-child(29)').after('<br />');
   $('.profile-field-list-perso label:nth-child(27)').after('<br />');
   $('.profile-field-list-perso label:nth-child(24)').after('<br />');
   $('.profile-field-list-perso label:nth-child(21)').after('<br />');
   $('.profile-field-list-perso label:nth-child(18)').after('<br />');
   $('.profile-field-list-perso label:nth-child(15)').after('<br />');
   $('.profile-field-list-perso label:nth-child(12)').after('<br />');
   $('.profile-field-list-perso label:nth-child(9)').after('<br />');
   $('.profile-field-list-perso label:nth-child(6)').after('<br />');
   $('.profile-field-list-perso label:nth-child(3)').after('<br />');

});


Dernière édition par Musara le Ven 12 Fév 2016 - 20:48, édité 2 fois

Musara
**

Masculin
Messages : 50
Inscrit(e) le : 02/01/2016

http://musaraignes.forumactif.fr/
Musara a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Alignement de la liste des images pour le Profil

Message par Hirakyo152 le Ven 12 Fév 2016 - 20:45

J'ai juste ajouté quelques lignes... et ça me convient parfaitement Very Happy

Code:
$(function(){
 
  $('#profile_field_8_4').after('<div class="profile-field-list-perso"></div>');
 
  $('.profile-field-list-perso').append($('#profile_field_8_4 label'));
 
  $('#profile_field_8_4').remove();
 
  $('.profile-field-list-perso label:nth-child(29)').after('<br />');
  $('.profile-field-list-perso label:nth-child(30)').after('<br />');
  $('.profile-field-list-perso label:nth-child(27)').after('<br />');
  $('.profile-field-list-perso label:nth-child(24)').after('<br />');
  $('.profile-field-list-perso label:nth-child(21)').after('<br />');
  $('.profile-field-list-perso label:nth-child(18)').after('<br />');
  $('.profile-field-list-perso label:nth-child(15)').after('<br />');
  $('.profile-field-list-perso label:nth-child(12)').after('<br />');
  $('.profile-field-list-perso label:nth-child(9)').after('<br />');
  $('.profile-field-list-perso label:nth-child(6)').after('<br />');
  $('.profile-field-list-perso label:nth-child(3)').after('<br />');
 
});

Merci encore, Musara Wink

Hirakyo152
**

Masculin
Messages : 86
Inscrit(e) le : 17/01/2016

http://kaminoakuma.forumactif.org/
Hirakyo152 a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum