Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Page 2 sur 2 Précédent  1, 2

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

Résolu Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Mar 6 Déc 2011 - 20:07

Rappel du premier message :

Bonjour à tous,
Encore une demande d'aide pour du javascipt de la part d'un petit padawan dont les capacités en codage sont à dégrossir. Rolling Eyes

Donc, faisons simple, faisons bien. Mes membres m'ont demandé de leur installer un bouton sur le message étendu afin de mettre en place quelque chose qui ressemble à un tag de modération mais cette fois ci pour les membres.

J'ai réussi à installer le bouton sur le message étendu de la façon suivante :
Dans le posting-body,juste après
Code:
<button class="{BUTTON_WYSI_STYLE}" id="text_editor_cmd_switchmode" type="button"><img src="{PATH_IMG_FA}i/switch_wysiwyg.gif" alt="{SWITCH_EDITOR_MODE}" /></button>&nbsp
; j'ai placé
Code:
<button class="button2" onclick="bbfontstyle(' [mod]', ' [/mod]');return false"type="button" title="deco pour membre"><img src="http://i43.servimg.com/u/f43/11/93/85/24/sans_t31.gif"/></button> 

Dans le template overall footer, j'ai placé ceci juste avant la fermeture du body
Code:
<script type="text/javascript">
    var ciklepost=document.getElementsByTagName("div");
    var sj=0;
    for (sj=0; sj<ciklepost.length; sj++){
    if (ciklepost[sj].className=="postbody"){
    ciklepost[sj].innerHTML=ciklepost[sj].innerHTML.replace(' [mod] ', "<div style='border: 2px groove #000; padding: 1px; background: black; height: auto; -moz-border-radius:20px;  -webkit-border-radius:20px;  -khtml-border-radius:20px;  -border-radius:20px; '><img src='http://i43.servimg.com/u/f43/11/93/85/24/sans_t30.gif' style='background: transparent; margin-right: 30px; margin-top: 35px; padding-left: 6px;' align='left'><div style='background: #a4ea2c; height : 400 px; width: 500 px ;color : black; font-weight: bold; font-size:14px;'>Information importante: </div><div style='border-top: 1px dotted #000; width: 100%; padding-top: 3px;margin-bottom:10pt; '>");
    ciklepost[sj].innerHTML=ciklepost[sj].innerHTML.replace('[/mod]', "</div></div>");
    }
    }
    </script>

Mon bidouillage a parfaitement marché pendant plusieurs jours mais à occasionné au bout d'un certain temps un dysfonctionnement du système de redimensionnement des images (disparition du réduire /agrandir et un affichage grandeur nature des images) et un centrage des images contenues dans les topics (smileys et décoration des topics).

Voyez vous dans ma manière de procéder ou dans le codage mise en place quelque chose qui entrerait en conflit avec le système de redimensionnement.
Merci par avance pour votre aide et vos réponses.


Dernière édition par demeter1 le Dim 26 Fév 2012 - 11:01, édité 1 fois

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Lun 30 Jan 2012 - 21:21

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Mer 1 Fév 2012 - 18:12

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par Ea le Mer 1 Fév 2012 - 18:28

Donc vous voulez mettre ce script là qui fait bugger le redimensionnement d'image :

Code:
<script type="text/javascript">
    var ciklepost=document.getElementsByTagName("div");
    var sj=0;
    for (sj=0; sj<ciklepost.length; sj++){
    if (ciklepost[sj].className=="postbody"){
    ciklepost[sj].innerHTML=ciklepost[sj].innerHTML.replace(' [mod] ', "<div style='border: 2px groove #000; padding: 1px; background: black; height: auto; -moz-border-radius:20px;  -webkit-border-radius:20px;  -khtml-border-radius:20px;  -border-radius:20px; '><img src='http://i43.servimg.com/u/f43/11/93/85/24/sans_t30.gif' style='background: transparent; margin-right: 30px; margin-top: 35px; padding-left: 6px;' align='left'><div style='background: #a4ea2c; height : 400 px; width: 500 px ;color : black; font-weight: bold; font-size:14px;'>Information importante: </div><div style='border-top: 1px dotted #000; width: 100%; padding-top: 3px;margin-bottom:10pt; '>");
    ciklepost[sj].innerHTML=ciklepost[sj].innerHTML.replace('[/mod]', "</div></div>");
    }
    }
    </script>
J'imagine que l'exécuter 1 seconde après l'ouverture de la page devrait suffire :

Code:
<script type="text/javascript">
jQuery(function(){
  setTimeout(function(){
    var ciklepost=document.getElementsByTagName("div");
    var sj=0;
    for (sj=0; sj<ciklepost.length; sj++){
    if (ciklepost[sj].className=="postbody"){
    ciklepost[sj].innerHTML=ciklepost[sj].innerHTML.replace(' [mod] ', "<div style='border: 2px groove #000; padding: 1px; background: black; height: auto; -moz-border-radius:20px;  -webkit-border-radius:20px;  -khtml-border-radius:20px;  -border-radius:20px; '><img src='http://i43.servimg.com/u/f43/11/93/85/24/sans_t30.gif' style='background: transparent; margin-right: 30px; margin-top: 35px; padding-left: 6px;' align='left'><div style='background: #a4ea2c; height : 400 px; width: 500 px ;color : black; font-weight: bold; font-size:14px;'>Information importante: </div><div style='border-top: 1px dotted #000; width: 100%; padding-top: 3px;margin-bottom:10pt; '>");
    ciklepost[sj].innerHTML=ciklepost[sj].innerHTML.replace('[/mod]', "</div></div>");
    }
    }
  },1000);
});
    </script>
Cordialement.

Ea
Aidactif
Aidactif

Messages : 23428
Inscrit(e) le : 04/04/2008

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

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Ven 3 Fév 2012 - 14:45

Bonjour Etana, je viens de faire un essai mais je me heurte à un petit soucis. Avec la refonte récente du overall footer, je ne sais plus trop ou installer le script. Confused J'ai tenté de le placer juste avant la fermeture du body dans le template overall footer begin sans sucés. Je l'ai ensuite supprimé de ce template pour l'installer dans le template overall footer end mais sans succès également.
Une petie idée pour savoir ou l'installer suite à cette refonte du template overall footer ???

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par Ea le Ven 3 Fév 2012 - 14:54

Cela devrait marcher de tout endroit html.

Sinon le code pourrait être moins barbare, et on peut le mettre directement dans la gestion des javascript :

Code:
$(function(){
  setTimeout(function(){
      $("div.postbody").each(function(){
         $(this).html($(this).html().replace(/\[mod\]([\s\S]*?)\[\/mod\]/g,"<div style='border: 2px groove #000; padding: 1px; background: black; height: auto; -moz-border-radius:20px;  -webkit-border-radius:20px;  -khtml-border-radius:20px;  -border-radius:20px; '><img src='http://i43.servimg.com/u/f43/11/93/85/24/sans_t30.gif' style='background: transparent; margin-right: 30px; margin-top: 35px; padding-left: 6px;' align='left'><div style='background: #a4ea2c; height : 400 px; width: 500 px ;color : black; font-weight: bold; font-size:14px;'>Information importante: </div><div style='border-top: 1px dotted #000; width: 100%; padding-top: 3px;margin-bottom:10pt; '>$1</div></div>"));
    });
  },1000);
});
Cordialement.

Ea
Aidactif
Aidactif

Messages : 23428
Inscrit(e) le : 04/04/2008

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

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Dim 5 Fév 2012 - 9:33

Bonjour Etana,
Merci pour tout ce mal que vous vous donnez. Le script fonctionne mais avec les mêmes soucis du départ c'est à dire : désactivation du système de redimensionnement et centrage des smileys. Désolé pour cette mauvaise nouvelle Embarassed (j'ai un peu honte d'annoncer cela).

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Lun 6 Fév 2012 - 18:59

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Sam 11 Fév 2012 - 11:43

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Jeu 16 Fév 2012 - 22:47

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Sam 18 Fév 2012 - 19:09

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Lun 20 Fév 2012 - 10:43

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Mar 21 Fév 2012 - 21:16

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Jeu 23 Fév 2012 - 20:38

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Sam 25 Fév 2012 - 11:06

up

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Javascript fonctionnel mais qui fait beuger le système de redimensionement des images

Message par demeter1 le Dim 26 Fév 2012 - 11:01

Bon, j'ai fini par modifier mon javascript de façon à ce que le système de redimensionnement ne beugue pas. L'ensemble fonctionne maintenant à merveille.

Dans le css
Code:
/*############balise mod pour les membres###########*/
        #mod
        {
        border:1px double #7b9c40;
        color:white;
        font-weight:bold;
        background-color:black;
        padding:5px 10px;
        margin:10px;
        -moz-border-radius:5px;
        -webkit-border-radius:5px ;
        border-radius:5px;
        } 

et en javascript coché sur les sujets

Code:
jQuery(document).ready(function()  {
          var divs = document.getElementsByTagName('div');
          for (i=0; i<divs.length; i++){
              if(divs[i] != null && divs[i].className == 'postbody'){   
                chaine1 = new String('[\[]mod[^[]');
                reg = new RegExp(chaine1, 'g');
                reg2 = new RegExp('[\[]/mod[^[]', 'g');
                contenu = divs[i].innerHTML;
                split = contenu.split(" ");
                nouveaucontenu = contenu.replace(reg,'<div id="mod"><img style="float:left;margin-right:7px;" src="http://i43.servimg.com/u/f43/11/93/85/24/sans_t40.gif" />  ').replace(reg2,'</div>');
                if(contenu != nouveaucontenu){
                    divs[i].innerHTML = nouveaucontenu;
                }
         
              }
          }
        });


demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Page 2 sur 2 Précédent  1, 2

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