Problème au niveau d'un script

[QuentinPLR]

Bonjour à toutes et à tous. Depuis quelques temps je cherche à créer un javascript afin de personnaliser encore plus mon forum et le rendre un peu plus dynamique. Cependant j'ai un soucis : Je ne maîtrise pas ce langage.
Avant de me tourner vers vous, je suis allé sur des sites expliquant le Javascript en espérant que cela puisse m'aider à concevoir celui qu'il me faut. Cependant, ça ne m'aide pas vraiment, je n'y arrive pas.
C'est donc pourquoi je suis ici. J'espère pouvoir trouver parmi la communauté Forumactif une personne pouvant m'aider à créer ces quelques lignes de codes.

Je vais essayer d'écrire en langage naturel ce que j'attend de ce javascript :

"Si une certaine (Pas n'importe laquelle) image est affichée, modifier le style d'une class."

J'ai déjà essayé quelques trucs en utilisant ce code : 

Code:

$(function() {
         $('img[src="http://i19.servimg.com/u/f19/17/89/47/01/veryho10.gif"]').closest('icon').addClass('épinglé');
  
        });

Cependant je ne peux modifier la valeur que de la class "icon" qui est la class qui contient l'image, or moi je voudrais modifier la class d'un élément externe de l'image, une class qui est sans lien avec l'image.

Je ne sais pas si j'ai été clair ^-^, n'hésitez pas me poser des questions si vous ne cernez pas mon problème.
Merci!

[no_way]

Bonjour, ce que vous demandez est tout à fait possible, je vous fournis la structure:

Code:

$(function(){
if($('img[src="http://i19.servimg.com/u/f19/17/89/47/01/veryho10.gif"]').length){
/*votre code cernant l'élément externe à l'image */
}
});

[QuentinPLR]

Merci pour cette réponse rapide!
Cependant, j'ai un peu de mal à comprendre ce que vous entendez par "votre code cernant l'élément externe à l'image". Pouvez vous m'éclairer?

[no_way]

Oui bien sûr, vous ne précisez pas l'élément dont il est question:

or moi je voudrais modifier la class d'un élément externe de l'image

Il me faut donc savoir quel est l'élément en question

[QuentinPLR]

Oh, autant pour moi ^^.

Je voudrais modifier le background de div.topictitle 

Code:

<div class="topictitle">
            <!-- {topics_list_box.row.NEWEST_POST_IMG}{topics_list_box.row.PARTICIPATE_POST_IMG}{topics_list_box.row.TOPIC_TYPE} -->
            <span>
               <a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a> {topics_list_box.row.NEWEST_POST_IMG}
                          </span>
                          <br/>
                          <span class="author">Démarré par {topics_list_box.row.TOPIC_AUTHOR}
  </span>
                          </div>

en lui donnant ce style : 

Code:

{
  background-image: url(http://i19.servimg.com/u/f19/17/89/47/01/quick_10.gif);
  background-repeat: no-repeat;
  background-position: 98% 4px;
 
}

[no_way]

Fort bien, voici le code à utiliser en ce cas:

Code:

 $(function(){
        if($('img[src="http://i19.servimg.com/u/f19/17/89/47/01/veryho10.gif"]').length){
        $("div.topictitle").each(function(){$(this).css("background","url(http://i19.servimg.com/u/f19/17/89/47/01/quick_10.gif) no-repeat 98% 4px")});
        }});

je crains en revanche ne pas avoir totalement cerné ce que vous désirez, auriez vous un lien à me fournir pour une page ou doit agir le script ?

[QuentinPLR]

Merci beaucoup! Cependant, il y a un petit problème, et c'est de ma faute :3. Un petit screen pour expliquer :


En fait j'aimerai les modifications ne se fassent que sur la ligne concernée ^-^', désolée si je l'ai pas signalé plus tôt. (Pour l'instant, le code que tu m'as fournit met une punaise sur la droite à tous les types de sujet. Je voudrai que ça n'en mette que pour les sujets épinglés.) Est-ce possible?

[no_way]

Tout est toujours possible mais j'apprécierais que vous me fournissiez le lien , je connais peu invision

[QuentinPLR]

ça risque d'être compliqué de vous donner un lien x) Je travaille dessus avec une amie et on a pour habitude de s'écrire des choses persos quand on veut tester des trucs, d'où les bandes noires sur l'image x).

En revanche je peux vous donner les templates ou ce que vous voulez.

Ah et aussi, je suis en Phbb2!

[no_way]

Voici un script à essayer

Code:

$(function(){
$('img[src="http://i19.servimg.com/u/f19/17/89/47/01/veryho10.gif"]').each(function(){$(this).parents("tr").find("div.topictitle").css("background","url(http://i19.servimg.com/u/f19/17/89/47/01/quick_10.gif) no-repeat 98% 4px")});
});

Ce devrait se comporter comme vous le désirez à présent

[QuentinPLR]

Encore merci pour cette réponse ^-^, ça fait plaisir de recevoir une telle aide.
Cependant, ça ne change pas vraiment du problème que j'ai mentionné juste avant :/ Je sens que nous y sommes presque!

[no_way]

Ah ? Qu'y a t-il qui ne fonctionne pas avec ce script ?

Je vous en prie pour l'aide, mais n'hésitez pas à être précis dans la mesure ou je code un peu en aveugle là ,

si vraiment ça ne va pas, je vous prie de bien vouloir me fournir votre template topics_list_box

[QuentinPLR]

Ce que j'aimerai en fait c'est que le petit truc là  ne s'affiche que lorsqu'il s'agit d'un sujet épinglé. ( ).
Pour l'instant le code que vous m'avez fournit affiche ce qu'il y a sur l'image, ce qui est souligné en rouge  à droite sont les éléments qui ne devraient pas être affichés :/.

[no_way]

Ah oui, je me suis trompé en effet, voici le script:

Code:

$(function(){
        $('img[src="http://i19.servimg.com/u/f19/17/89/47/01/veryho10.gif"]').each(function(){$($(this).parents("tr")[0]).find("div.topictitle").css("background","url(http://i19.servimg.com/u/f19/17/89/47/01/quick_10.gif) no-repeat 98% 4px")});
        });

[QuentinPLR]

Zut, ça donne le même résultat

[no_way]

Pourriez-vous me fournir votre template topics_list_box s'il vous plait ?

[QuentinPLR]

Code:

<!-- BEGIN topics_list_box --><!-- BEGIN row --><!-- BEGIN header_table --><!-- BEGIN multi_selection -->
<script type="text/javascript">
function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
   var all_checked = true;
   for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
      if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
         all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
      }
   }
   document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
}
function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
   for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
      if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
         document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
      }
   }
}
</script>
<!-- END multi_selection -->


 
<table class="liste-sujets" width="100%"  cellspacing="0" >
   <tr class="fond-cat-liste">
               <th scope="col" class="fond-cat-list-gauche" width="8%" colspan="2">&nbsp;</th>
               <th scope="col" class="lefttext" align="left">Titre / Démarré par</th>
               <th scope="col" width="14%">Réponses / Vues</th>
               <th scope="col" class="fond-cat-list-droit" width="22%" align="left">Dernier message </th>
            </tr>
  <tr class="lecteurs-sujets">
   <td colspan="5" class="lecteurs-sujets" ><span id="qeslf" >{FORUM_ONLINE_USERS} dans cette section.</span>
      <script type="text/javascript">
document.getElementById('qeslf').innerHTML=document.getElementById('qeslf').innerHTML.replace(/Utilisateurs parcourant actuellement ce forum: /,"").replace(/Utilisateurs parcourant actuellement ce forum: /,"");
</script>
               </td>
          </tr>
   <!-- END header_table --><!-- BEGIN header_row -->
   <tr>
      <td class="row-sujet" colspan="{topics_list_box.row.COLSPAN}"><span class="gensmall">&nbsp;<b>{topics_list_box.row.L_TITLE}  {topics_list_box.row.LAST_POST_IMG}</b></span></td>
   </tr>
<!-- END header_row -->

<!-- BEGIN topic -->
{topics_list_box.row.END_TABLE_STICKY}
   <tr>

      <!-- BEGIN single_selection -->
      <td class="row-sujet" align="center" valign="middle" width="20"><input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
      <!-- END single_selection -->
      <td class="row-sujet-foncé" align="center" valign="middle" width="20"><img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" /></td>
      <!-- BEGIN icon -->
      <td class="row-sujet-foncé" align="center" valign="middle" width="20">{topics_list_box.row.ICON}</td>
      <!-- END icon -->
      <td class="row-sujet" >
         <div class="topictitle">
            <!-- {topics_list_box.row.NEWEST_POST_IMG}{topics_list_box.row.PARTICIPATE_POST_IMG}{topics_list_box.row.TOPIC_TYPE} -->
            <span>
               <a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a> {topics_list_box.row.NEWEST_POST_IMG}
                          </span>
                          <br/>
                          <span class="author">Démarré par {topics_list_box.row.TOPIC_AUTHOR}
  </span>
                          </div>
         
         <!-- BEGIN switch_description -->
         <span class="genmed">
            <br />
            {topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
         </span>
         <!-- END switch_description -->
         
         
      </td>

          <td class="row-sujet-foncé" align="center" valign="middle"><span class="réponses-vues">{topics_list_box.row.REPLIES} Réponses<br/>
            {topics_list_box.row.VIEWS} Vues</span></td>
      <td class="row-sujet"  valign="middle" nowrap="nowrap">
            <!-- BEGIN avatar -->
            <div style="width: 200px;"></div>
            <span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
            <!-- END avatar -->

                <span class="icon-lastpost">{topics_list_box.row.LAST_POST_IMG}</span><span class="dernier-message">{topics_list_box.row.LAST_POST_TIME}<br /><span class="author-last">par {topics_list_box.row.LAST_POST_AUTHOR} </span></span>
        </td>
<!-- BEGIN multi_selection -->
      <td class="row-sujet" align="center" valign="middle"><span class="postdetails"><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></span></td>
   <!-- END multi_selection -->
   </tr>
   <!-- END topic --><!-- BEGIN no_topics -->
   <tr>
      <td class="row-sujet" colspan="{topics_list_box.row.COLSPAN}" align="center" valign="middle" height="30"><span class="gen">{topics_list_box.row.L_NO_TOPICS}</span></td>
   </tr>
   <!-- END no_topics --><!-- BEGIN bottom -->
   <tr>
      <td class="catBottom" colspan="{topics_list_box.row.COLSPAN}" valign="middle">
         <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
                                  <div class="pagelinks"><span class="pagination">[{PAGINATION}]</span>&nbsp;<a href="#top"><strong>En haut</strong></a></div>
            </tr>
         </table>
      </td>
   </tr>
<!-- END bottom --><!-- BEGIN footer_table -->
</table><!-- END footer_table --><!-- BEGIN spacer --><br class="gensmall" /><!-- END spacer --><!-- END row --><!-- END topics_list_box -->

[no_way]

De mon côté c'est bon pourtant:

Nous sommes bien d'accord que ce que vous avez souligné en rouge à gauche est normal et que le script n'est pas censé y modifier quoi que ce soit n'est-ce pas ?

[QuentinPLR]

Oui O_o"
Frustrationnnnnn T-T pourquoi ça ne marche pas chez moi

[no_way]

êtes-vous sûr que vous avez bien mis la dernière version du script ?
Si oui placez-vous sur une liste de sujets ou il n'y a pas de choses privées vous concernant, puis faites Ctrl +U
Copiez-collez tout le contenu en MP s.v.p ceci devrait me permettre de trouver ce qui cloche

[QuentinPLR]

Spoiler:

[QuentinPLR]

L'envoi de message privé plante quand je vous envoie le code

[no_way]

Pas de souci, j'ai compris d'où venait le problème, je n'ai pas les légendes concernant les messages sur mon forum de test alors que vous oui, voici donc le bon code:

Code:

$(function(){
$('.liste-sujets img[src="http://i19.servimg.com/u/f19/17/89/47/01/veryho10.gif"]').each(function(){
$($(this).parents("tr")[0]).find("div.topictitle").css("background","url(http://i19.servimg.com/u/f19/17/89/47/01/quick_10.gif) no-repeat 98% 4px")});
});

[QuentinPLR]

Donc du coup il faudrait que je n'affiche pas les légendes?

[QuentinPLR]

Oh my godd, ça marche

[QuentinPLR]

Merci infiniment !

[no_way]

Je t'en prie
N'oublie pas de mettre ton sujet en résolu et @ bientôt

[QuentinPLR]

Encore merciii!