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 Décembre 6th 2011, 8:07 pm

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 Février 26th 2012, 11:01 am, édité 1 fois
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Janvier 30th 2012, 9:21 pm

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 1st 2012, 6:12 pm

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 1st 2012, 6:28 pm

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

Ea
Aidactif
Aidactif

Messages : 23485
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 Février 3rd 2012, 2:45 pm

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

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 3rd 2012, 2:54 pm

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

Ea
Aidactif
Aidactif

Messages : 23485
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 Février 5th 2012, 9:33 am

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

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 6th 2012, 6:59 pm

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 11th 2012, 11:43 am

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 16th 2012, 10:47 pm

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 18th 2012, 7:09 pm

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 20th 2012, 10:43 am

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 21st 2012, 9:16 pm

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 23rd 2012, 8:38 pm

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 25th 2012, 11:06 am

up
avatar

demeter1
Membre actif

Masculin
Messages : 8457
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 Février 26th 2012, 11:01 am

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;
                }
         
              }
          }
        });

avatar

demeter1
Membre actif

Masculin
Messages : 8457
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