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
avatar

Peggy06
****

Messages : 306
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 ...
avatar

AenigmA
Membre actif

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.
avatar

Peggy06
****

Messages : 306
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;}
avatar

FANCH 56
Membre actif

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
avatar

Peggy06
****

Messages : 306
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.
avatar

FANCH 56
Membre actif

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.
avatar

Peggy06
****

Messages : 306
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.

avatar

FANCH 56
Membre actif

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.
avatar

Peggy06
****

Messages : 306
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.
avatar

FANCH 56
Membre actif

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.
avatar

Peggy06
****

Messages : 306
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;
    }

avatar

MlleAlys
Membre actif

Messages : 4568
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
avatar

FANCH 56
Membre actif

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.
avatar

Peggy06
****

Messages : 306
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