Impossible de masquer les widgets du forum

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

Résolu Impossible de masquer les widgets du forum

Message par Peggy06 le Mer 15 Avr 2015 - 14:40

Détails techniques


Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://evasionentrenous.forumactif.org/

Description du problème

Bonjour,
Désolé de vous ennuyer avec ce sujet maintes fois débattu, je souhaiterais masquer les widgets, j'ai bien suivi le tutoriel : http://forum.forumactif.com/t290241-afficher-masquer-les-widgets-du-forum#2557882
Mis le script :
Code:
$(function() {
          var c = $("#left,#right"), d, e = function(a) {
            var a = a.direct ? 0 : 1E3, b = $(this).data("side");
            window.localStorage && localStorage[("none" == $("#" + b).css("display") ? "remove" : "set") + "Item"]("wid" + b, "1");
            $("#" + b).stop(!0, !0).animate({width:"toggle", height:"toggle", opacity:"toggle"}, a);
            $(this).toggleClass("isopened isclosed")
          };
          c.length && ($("#content-container").prepend(d = $('<div id="widget-arrows"><div style="clear:both"></div></div>')), c.each(function() {
            $(this).find("script").remove();
            var a = $(this).attr("id"), b = $('<div class="widget-arrow is' + a + ' isopened"></div>');
            "right" == a && $("#content").prepend($("#right").css("padding", "0 10px")).css("margin-right", 0);
            b.data("side", a).appendTo(d).click(e);
            window.localStorage && "1" == localStorage.getItem("wid" + a) && b.trigger({type:"click", direct:!0})
          }))
        });
puis le code CSS :
Code:
Afficher / Masquer les widgets du forum

                        #widget-arrows {
          height: 13px;
        }
        .widget-arrow {
          height: 13px;
          width: 16px;
          border-radius: 4px;
          float: left;
          cursor: pointer;
          background: #f5ebf7 url(http://i19.servimg.com/u/f19/19/03/24/88/widget10.png) no-repeat 0 -13px;
        }
        .widget-arrow.isright {
          float: right;
        }
        .widget-arrow.isleft.isclosed, .widget-arrow.isright.isopened {
          background-position: 0 0;
        }
J'ai juste changé l'image, (mais même avec l'autre ce n'est pas mieux) ça ne fonctionne pas sur le forum. Est-ce que quelqu'un pourrait m'aider à trouver la faille.
D'avance merci.




Dernière édition par Peggy06 le Mer 15 Avr 2015 - 21:50, édité 1 fois

Peggy06
****

Messages : 302
Inscrit(e) le : 24/10/2014

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

Résolu Re: Impossible de masquer les widgets du forum

Message par AenigmA le Mer 15 Avr 2015 - 16:31

Bonjour,

Pourtant ça fonctionne bien sur votre forum ...

AenigmA
+ Hyperactif +

Masculin
Messages : 2228
Inscrit(e) le : 10/03/2005

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

Résolu Re: Impossible de masquer les widgets du forum

Message par Peggy06 le Mer 15 Avr 2015 - 18:22

bonjour,
Une fois que j'avais posté mon message je me suis rendu compte qu'il y avait un tout petit bouton en haut sur le côté gauche qui permet de fermer les widgets, mais mon image est beaucoup plus grande et ce que je voulais c'est comme sur celui de Fanch 56, fermé tout le temps et seulement ouvrir quand on veut regarder un sujet.

Peggy06
****

Messages : 302
Inscrit(e) le : 24/10/2014

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

Résolu Re: Impossible de masquer les widgets du forum

Message par FANCH 56 le Mer 15 Avr 2015 - 18:26

Bonsoir

Voici mon code javascript CACHE WIDGET (toutes les pages)

Code:
$(function() {
          var c = $("#left,#right"), d, e = function(a) {
            var a = a.direct ? 0 : 1E3, b = $(this).data("side");
            window.localStorage && localStorage[("none" == $("#" + b).css("display") ? "remove" : "set") + "Item"]("wid" + b, "1");
            $("#" + b).stop(!0, !0).animate({width:"toggle", height:"toggle", opacity:"toggle"}, a);
            $(this).toggleClass("isopened isclosed")
          };
          c.length && ($("#content-container").prepend(d = $('<div id="widget-arrows"><div style="clear:both"></div></div>')), c.each(function() {
            $(this).find("script").remove();
            var a = $(this).attr("id"), b = $('<div class="widget-arrow is' + a + ' isopened"></div>');
            "right" == a && $("#content").prepend($("#right").css("padding", "0 10px")).css("margin-right", 0);
            b.data("side", a).appendTo(d).click(e);
            window.localStorage && "1" == localStorage.getItem("wid" + a) && b.trigger({type:"click", direct:!0})
          }))
        });

Et voici le code CSS pour le bouton ouverture. Tu pourras récupérer l'image, mais l'héberger ailleurs.
Code:

/*CACHE WIDGET  */

 .widget-arrow {
 height: 138px;
width: 40px;
border-radius: 00px;
float: left;
cursor: pointer;
background: #f5ebf7 url(http://acbpr.fr/cb/techno/ouvrir5.jpg) no-repeat 0 0; }
.widget-arrow.isright { float: right;}
.widget-arrow.isleft.isclosed, .widget-arrow.isright.isopened {
background-position: 0px 0px;}
#widget-arrows {
height: 38px;
position: fixed;
bottom: 140px;}

FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Impossible de masquer les widgets du forum

Message par Peggy06 le Mer 15 Avr 2015 - 18:42

Merci beaucoup FANCH 56, ça marche, j'ai changé l'image, mais j'ai encore un petit souci, peut-on monter un peu le bouton car j'ai déjà celui de la chatbox au même endroit

Peggy06
****

Messages : 302
Inscrit(e) le : 24/10/2014

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

Résolu Re: Impossible de masquer les widgets du forum

Message par FANCH 56 le Mer 15 Avr 2015 - 18:56

La position dans le CSS est en fixed, il faut coder pour l'endroit ou tu le veux.

FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Impossible de masquer les widgets du forum

Message par Peggy06 le Mer 15 Avr 2015 - 19:10

mince, je ne connais pas grand chose, je suis novice.J'aimerais l'avoir légèrement au-dessus car là il se retrouve s/s le bouton de la chatbox.

Donc ce code où dois-je le mettre ?
merci, merci pour tes réponses rapides.

Peggy06
****

Messages : 302
Inscrit(e) le : 24/10/2014

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

Résolu Re: Impossible de masquer les widgets du forum

Message par FANCH 56 le Mer 15 Avr 2015 - 19:56

Ben non moi je vois bien.


FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Impossible de masquer les widgets du forum

Message par Peggy06 le Mer 15 Avr 2015 - 20:03

Et on ne peut pas le mettre juste au-dessus de l'autre, car là, il empiète sur une catégorie de forum.

Peggy06
****

Messages : 302
Inscrit(e) le : 24/10/2014

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

Résolu Re: Impossible de masquer les widgets du forum

Message par FANCH 56 le Mer 15 Avr 2015 - 20:21

Si tu joues avec la roulette, il n'empiète pas et ne gêne aucunement.

FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Impossible de masquer les widgets du forum

Message par Peggy06 le Mer 15 Avr 2015 - 20:33

je sais, je suis pinailleuse, mais au niveau esthétique je n'aime pas. Si on doit en passer par là je le ferais, mais pour moi c'est pas top.

Peggy06
****

Messages : 302
Inscrit(e) le : 24/10/2014

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

Résolu Re: Impossible de masquer les widgets du forum

Message par MlleAlys le Mer 15 Avr 2015 - 20:34

Bonjour,

Je peux proposer des modification pour que l'image soit mieux placée et ne pas gêner, mais du coup elle ne changera plus entre ouvert et fermé...

  • essayez en remplaçant votre javascript par celui là :
    Code:
    $(function() {
              var c = $("#left,#right"), d, e = function(a) {
                var a = a.direct ? 0 : 1E3, b = $(this).data("side");
                window.localStorage && localStorage[("none" == $("#" + b).css("display") ? "remove" : "set") + "Item"]("wid" + b, "1");
                $("#" + b).stop(!0, !0).animate({width:"toggle", height:"toggle", opacity:"toggle"}, a);
                $(this).toggleClass("isopened isclosed")
              };
              c.length && ($("#content-container").prepend(d = $('<div id="widget-arrows"><div style="clear:both"></div><img src="http://i19.servimg.com/u/f19/19/03/24/88/widget10.png"/></div>')), c.each(function() {
                $(this).find("script").remove();
                var a = $(this).attr("id"), b = $('<div class="widget-arrow is' + a + ' isopened"></div>');
                "right" == a && $("#content").prepend($("#right").css("padding", "0 10px")).css("margin-right", 0);
                b.data("side", a).appendTo(d).click(e);
                window.localStorage && "1" == localStorage.getItem("wid" + a) && b.trigger({type:"click", direct:!0})
              }))
            });

  • Puis le code css suivant :
    Code:
    .widget-arrow {
      background: #f5ebf7 url(http://i19.servimg.com/u/f19/19/03/24/88/widget10.png) no-repeat 0 0;
      border-radius: 0;
      cursor: pointer;
      float: left;
      height: 140px;
      width: 60px;
    }

    Modifiez-le ainsi :
    Code:
    .widget-arrow {
      border-radius: 0;
      cursor: pointer;
      float: right;
      height: 140px;
      position: relative;
    }

  • Ajoutez le code css suivant :
    Code:
    .widget-arrow img {
      position: absolute;
      right: 0;
    }

  • Le code css suivant :
    Code:
    #widget-arrows {
      bottom: 140px;
      height: 60px;
      position: fixed;
    }

    Supprimez la ligne height: 60px; et augmentez la valeur de "bottom" pour remonter l'image, par exemple :
    Code:
    #widget-arrows {
      bottom: 300px;
      position: fixed;
    }


MlleAlys
+ Hyperactif +

Messages : 4404
Inscrit(e) le : 12/09/2012

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

Résolu Re: Impossible de masquer les widgets du forum

Message par FANCH 56 le Mer 15 Avr 2015 - 20:35

Attends une réponse d'un codeur. Je ne vois pas comment changer. C'est sûrement au niveau de la position dans le CSS.

EDIT : oops MlleAlys à répondu

FANCH 56
+ Hyperactif +

Masculin
Messages : 13260
Inscrit(e) le : 25/07/2005

http://www.anciens-cols-bleus.net/
FANCH 56 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Impossible de masquer les widgets du forum

Message par Peggy06 le Mer 15 Avr 2015 - 21:49

Merci beaucoup à vous deux, j'ai réussi à le faire, ça marche.
Bonne soirée.

Peggy06
****

Messages : 302
Inscrit(e) le : 24/10/2014

http://evasionentrenous.forumactif.org/
Peggy06 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