Bouton Like en haut du message

2 participants

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

Résolu Bouton Like en haut du message

Message par LDL Lun 7 Mar 2016 - 6:26

Détails techniques


Version du forum : Invision
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Autre
Personnes concernées par le problème : Tous les utilisateurs
forum de test : http://14022010.fullsubject.com/

Description du problème

.


bonjour a tous,

J'ai utilise ce code qui fonctionne parfaitement sous invision (CSS + javascript) et qui vient du confrère forumactif portugais,
mais j'aurai besoin d'aide pour deux points précis :

1.
j'aimerai que tout soit en haut de chaque message (image, bouton, résultat...)
a margin-top: 17px du haut de chaque message. a quels endroits dois-je mettre cette donnée dans le code ?
2.
J'aimerai que contrairement a ce code, le résultat ne soit pas sous forme de lien (donc quand on survole, il n'y ait pas la main
comme sur une zone cliquable, que cela soit simplement une zone texte et image toute simple...). comment puis-je modifier le3 code ?

CSS
Spoiler:

JAVASCRIPT
Spoiler:

IMAGE DU RESULTAT
Spoiler:


Merci encore pour vos aides precieuses...
Bouton Like en haut du message Happy10


.


Dernière édition par LDL le Jeu 17 Mar 2016 - 2:19, édité 1 fois
LDL

LDL
****

Masculin
Messages : 235
Inscrit(e) le : 31/07/2009

LDL a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Bouton Like en haut du message

Message par LDL Mer 9 Mar 2016 - 14:38

Bouton Like en haut du message Etique12


Un up, de l'aide, non ?
encore merci pour le coup de pouce....
Smile
LDL

LDL
****

Masculin
Messages : 235
Inscrit(e) le : 31/07/2009

LDL a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Bouton Like en haut du message

Message par Miettes Mer 9 Mar 2016 - 17:58

Hellow Smile

j'aimerai que tout soit en haut de chaque message (image, bouton, résultat...)
a margin-top: 17px du haut de chaque message. a quels endroits dois-je mettre cette donnée dans le code ?

On va essayer ceci :
1) On met le parent en position relative pour l'avoir comme référence :
Code:
.postbody{
    position: relative;
}

2) On place le bloc "like" en position absolute, à droite et à 17px du haut :
Code:

.postbody #rep_bar {
    white-space: nowrap;
    margin: 1px 1px;
    position: absolute;
    top: 17px;
    right: 0;
}

Par contre, attention : un id (= représenté par un #) ne doit être présent qu'une seule fois sur ta page. Autrement dit, il vaut mieux supprimer l'id du bloc "rep_bar" Wink

J'aimerai que contrairement a ce code, le résultat ne soit pas sous forme de lien (donc quand on survole, il n'y ait pas la main
comme sur une zone cliquable, que cela soit simplement une zone texte et image toute simple...). comment puis-je modifier le3 code ?

ici :
Code:
.BS_like {
          -khtml-user-select: none;
          -moz-transition: all,0.15s;
          -moz-user-select: none;
          -ms-user-select: none;
          -o-transition: all,0.15s;
          -webkit-touch-callout: none;
          -webkit-transition: all,0.15s;
          -webkit-user-select: none;
          background: #222129 url(http://i84.servimg.com/u/f84/14/18/18/04/bouton15.png) no-repeat 6px center;
          background-size: 12px;
          border-radius: 5px;
          clear: both;
          color: #999;
          cursor: pointer;
          display: table;
          font-size: 11px;
          font-weight: 400;
          line-height: 18px;
          margin: 5px;
          padding: 3px 5px 3px 25px;
          text-align: right;
          transition: all,0.15s;
          user-select: none;
        }
on va supprimer la ligne :
Code:
cursor: pointer;
Miettes

Miettes
*****

Féminin
Messages : 590
Inscrit(e) le : 01/09/2008

http://tambouille-raleuses.forumactif.com/
Miettes a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Bouton Like en haut du message

Message par LDL Mer 9 Mar 2016 - 21:42

Miettes a écrit:Hellow Smile

1) On met le parent en position relative pour l'avoir comme référence :
......
Par contre, attention : un id (= représenté par un #) ne doit être présent qu'une seule fois sur ta page. Autrement dit, il vaut mieux supprimer l'id du bloc "rep_bar" Wink

merci pour ton aide.

dans ma feuille CSS je n'ai pas de rep_bar excepte dans le code que tu me donnes,
il doit donc se trouver je suppose dans le template, non ? sur la feuille posting_body genre ? ou ca exactement ?

sinon si je supprime simplement le # de ton script que je rajoute dans la feuille CSS, ca fonctionne pas malheureusement.

Miettes a écrit:Hellow Smile
on va supprimer la ligne :
cursor: pointer;

super, ca fonctionne, par contre si je supprime la ligne uniquement pour le paragraphe "BS_like" comme tu l'indiques ca fonctionne pas,
par contre si je supprime aussi celui du paragraphe précédent "rep_post .reput_vote", les deux et sur le bouton pour voter et celui des résultats disparaissent.

je l'ai donc laissé enlevé pour "rep_post .reput_vote", et je l'ai par contre rajouté dans le paragraphe suivant "BS_like:before",
et la nickel. on a bien la zone cliquable sur le bouton "Remercier" pour voter, et une fois voté, on a plus du tout de zone cliquable sur l'affichage du résultat "Mercis". Un problème en moins hehe....
Wink

.
LDL

LDL
****

Masculin
Messages : 235
Inscrit(e) le : 31/07/2009

LDL a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Bouton Like en haut du message

Message par Miettes Jeu 10 Mar 2016 - 10:15

Coucou Smile

il doit donc se trouver je suppose dans le template, non ?
Non Smile il est probablement dans la CSS de base du forum. Dans ce cas, ajoute uniquement dans ta CSS :
Code:
.postbody .rep_bar {
    position: absolute;
    top: 17px;
    right: 0;
}

sinon si je supprime simplement le # de ton script que je rajoute dans la feuille CSS, ca fonctionne pas malheureusement.
Il faut aussi faire la modif dans le js, ici :

Code:
var htmlFinal =
                    '<div class="rep_bar clearfix" id="rep_post">' +
                    '      <ul class="bs_inline">' + botao + numrep  + '</ul>' +
                    '</div>';

En supprimant l'id, ce qui donne :
Code:
var htmlFinal =
                    '<div class="rep_bar clearfix">' +
                    '      <ul class="bs_inline">' + botao + numrep  + '</ul>' +
                    '</div>';

Et du coup, dans la CSS, il faut remplacer tous les :
Code:
#rep_post
par :
Code:
.rep_bar
Miettes

Miettes
*****

Féminin
Messages : 590
Inscrit(e) le : 01/09/2008

http://tambouille-raleuses.forumactif.com/
Miettes a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Bouton Like en haut du message

Message par LDL Sam 12 Mar 2016 - 12:27

merci pour vos aides, je reviens sur ce thread pour tester les dernieres suggestions, le temps de virer mes virus sur mon pc,
a plus tard et merci...
Wink
LDL

LDL
****

Masculin
Messages : 235
Inscrit(e) le : 31/07/2009

LDL a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Bouton Like en haut du message

Message par LDL Mar 15 Mar 2016 - 19:16

bon ça y est, j'ai épuré les virus des mes supports, donc je reviens sur le thread...
(édition de ce message dans une petite heure...)
Wink



Dernière édition par LDL le Mer 16 Mar 2016 - 19:42, édité 2 fois
LDL

LDL
****

Masculin
Messages : 235
Inscrit(e) le : 31/07/2009

LDL a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Bouton Like en haut du message

Message par Miettes Mer 16 Mar 2016 - 16:13

Eh bien ce fut bien long ^^

On attend ton retour du coup Smile
Miettes

Miettes
*****

Féminin
Messages : 590
Inscrit(e) le : 01/09/2008

http://tambouille-raleuses.forumactif.com/
Miettes a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Bouton Like en haut du message

Message par LDL Mer 16 Mar 2016 - 19:42

Il faut aussi faire la modif dans le js
..............................

super, ça fonctionne !

(j'ai du faire quelques petites modifs sur la hauteur des blocs et la couleur des fonds, rien de mechant).
Bravo et encore merci Miettes pour avoir trouvé la soluce a mon problème ainsi que l'aide de tous les autres intervenants, merci a tous.

Je passe en mode RÉSOLU pour le lock service.
Wink




Bouton Like en haut du message Etique16

.
LDL

LDL
****

Masculin
Messages : 235
Inscrit(e) le : 31/07/2009

LDL 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