problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

3 participants

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

Résolu problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par .gasoline. Jeu 27 Déc 2018 - 22:48

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Moi uniquement
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

bonsoir ! ::pourtoi::

je viens vers vous parce que j'ai un problème avec ce tutoriel juste ici !!

je l'ai ajouté dans mon javascript + css, ça fonctionne mais mal... j'ai en suite trouvé un autre sujet ici, mais malheureusement la solution ne marche pas non plus..
je n'ai aucun autre code css ou javascript qui peut modifier l'éditeur.. donc je ne comprends vraiment pas ce qui peut bloquer :/
si vous pouviez m'aider vous me sauveriez vraiment !! ::fleur::
.gasoline.

.gasoline.
Nouveau membre

Féminin
Messages : 14
Inscrit(e) le : 16/12/2018

Voir le profil de l'utilisateur http://dearlittlebird.forumactif.com/
.gasoline. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par *Splash* Jeu 27 Déc 2018 - 23:36

Hi,
Le problème ne vient pas du tuto mais de la taille de ton avatar qui est trop grande, réduit-là !

Reprend le javascript du tuto de Tech et pour la CSS tu mets le code donné par Demeter (second lien), ce code :
Code:
#av_quickreply img{
  position: relative;
  top: 35px;
  left: 15px;
  max-width: 100px;
  max-height: 160px;        
    }
 
#av_quickreply {
    float: left;
    position : absolute;
}

Ton avatar se réduira automatiquement
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3806
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par .gasoline. Ven 28 Déc 2018 - 1:13

merci beaucoup pour ta réponse ! ::fleur::
le code tel quel ne fonctionne pas.. pour redimensionner l'image il a fallu que je retire les "max" devant width & height.

mon image est maintenant redimensionnée, mais l'éditeur ne bouge pas.. est-ce-qu'il y a un code qui permet de le redimensionner/décaler sur la droite ?

capture d'écran:
.gasoline.

.gasoline.
Nouveau membre

Féminin
Messages : 14
Inscrit(e) le : 16/12/2018

Voir le profil de l'utilisateur http://dearlittlebird.forumactif.com/
.gasoline. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par *Splash* Ven 28 Déc 2018 - 1:25

Tu peux me communiquer ton image d'avatar
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3806
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par .gasoline. Ven 28 Déc 2018 - 14:57

.gasoline.

.gasoline.
Nouveau membre

Féminin
Messages : 14
Inscrit(e) le : 16/12/2018

Voir le profil de l'utilisateur http://dearlittlebird.forumactif.com/
.gasoline. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par *Splash* Ven 28 Déc 2018 - 15:34

OK

Voilà le rendu en utilisant intégralement le tuto du FDF, celui de Tech, sur mon forum test en version phpBB2

problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide" Sans_t44

Ce qui veut dire que pour toi le blème ne vient donc pas de ce tuto, mais bien d'ailleurs
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3806
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par .gasoline. Ven 28 Déc 2018 - 15:47

après déduction parce que j'ai aucun code qui touche cette partie là du forum, je pense que c'est la largeur de mon forum !
mais je n'ai pas envie de l'élargir, donc savoir si c'est possible via un code de redimensionner l'éditeur ?
.gasoline.

.gasoline.
Nouveau membre

Féminin
Messages : 14
Inscrit(e) le : 16/12/2018

Voir le profil de l'utilisateur http://dearlittlebird.forumactif.com/
.gasoline. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par *Splash* Ven 28 Déc 2018 - 15:55

Il a quelle largeur ton forum ?
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3806
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par .gasoline. Ven 28 Déc 2018 - 15:58

normalement à 60% et là pour tester avec l'avatar je l'ai mit à 80%
.gasoline.

.gasoline.
Nouveau membre

Féminin
Messages : 14
Inscrit(e) le : 16/12/2018

Voir le profil de l'utilisateur http://dearlittlebird.forumactif.com/
.gasoline. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par *Splash* Ven 28 Déc 2018 - 16:06

Alors pour une largeur de 60%, tu supprimes totalement le code CSS pour ne garder que le script, ton avatar viendra se positionner centré au-dessus du cadre de la réponse rapide

problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide" Sans_t45
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3806
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par .gasoline. Ven 28 Déc 2018 - 16:32

c'est pas ce que je souhaite, mais je met un screen de ce que je voudrais arriver à avoir.

Spoiler:
.gasoline.

.gasoline.
Nouveau membre

Féminin
Messages : 14
Inscrit(e) le : 16/12/2018

Voir le profil de l'utilisateur http://dearlittlebird.forumactif.com/
.gasoline. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par katia26 Sam 29 Déc 2018 - 0:05

Juste pour voir le lien du forum j'éditerai ensuite.

EDIT :

Normalement ça devrait régler le problème Smile

Code:
form#quick_reply {
    margin-left: auto;
    margin-right: auto;
    width: 400px; /* La taille à modifier */
}
avatar

katia26
Nouveau membre

Messages : 25
Inscrit(e) le : 12/01/2010

Voir le profil de l'utilisateur http://dominion.forumpro.fr/
katia26 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par Invité Sam 29 Déc 2018 - 5:54

Hello .gasoline. ,
tes avatars ont des dimensions importantes 200px par 320px.

Soit on réduit les avatars de moitié et le style sera ainsi:
Code:
#av_quickreply img
{
position: relative;
max-width: 100px !important;
max-height: 160px!important;
border-radius:6px;
}
 
#av_quickreply
{
float:left;
position : absolute;
width:100px;
height:160px;
margin-left:80px;
margin-top: 40px;
}

Soit on ne touche pas à la dimensions des avatars et on augmente la hauteur de l'éditeur en proportion de l'avatar :

Code:
#av_quickreply img
{
position: relative;
width:200px;
height:320px;
border-radius:6px;
}
 
#av_quickreply
{
    float: left;
    height: 320px;
    margin-left: 0px;
    margin-top: 5px;
    position: absolute;
    width: 200px;

}

div.sceditor-container{min-height:320px !important;}

Avec ce style tu peux toujours déplacer l'éditeur sur la gauche en ajoutant left avec une valeur afin de mettre un espace entre l'avatar et l'éditeur à cette div:
Code:
div.sceditor-container{min-height:320px !important;left:30px!important;}






Ou en poussant un peu plus loin avec une animation au survol de l'éditeur on affiche l'avatar:

Code:
#av_quickreply img
{
position: relative;
width:200px;
height:320px;
border-radius:6px;
}
 
#av_quickreply
{
    float: left;
    height: 320px;
    margin-left:250px;
    margin-top: 5px;
    position: absolute;
    width: 200px;
  -webkit-transition: margin-left 0.5s ease-in-out;
-moz-transition: margin-left 0.5s ease-in-out;
-o-transition: margin-left 0.5s ease-in-out;
transition: margin-left 0.5s ease-in-out;


}
#quick_reply:hover #av_quickreply{margin-left:0px;}
div.sceditor-container{min-height:330px !important;left:30px!important;}

a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: problème avec le tuto "Ajouter l'avatar du membre à côté de la réponse rapide"

Message par .gasoline. Sam 29 Déc 2018 - 20:55

merci beaucoup à vous !! en bidouillant avec tous les codes que vous m'avez donné j'ai réussis. ::fete::
.gasoline.

.gasoline.
Nouveau membre

Féminin
Messages : 14
Inscrit(e) le : 16/12/2018

Voir le profil de l'utilisateur http://dearlittlebird.forumactif.com/
.gasoline. a été remercié(e) par l'auteur de ce sujet.

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

- Sujets similaires

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