3
Indiquez l’intérêt que vous portez à cette question
0

spip : boucle différente si javascript est activé (ou non)

Bonjour,

Je souhaiterais faire une boucle avec affichage conditionnel de sorte que si javascript n’est pas activé sur le navigateur c’est la première boucle qui s’exécute, sinon c’est la deuxième.

BOUCLE 1 (sans javascript) :

<B_articles1>
  #ANCRE_PAGINATION
  <div class="sansscript">
    <ul>
      <BOUCLE_articles1(ARTICLES) {!par date} {pagination 25}>
        <li>
          [(#LOGO_ARTICLE_RUBRIQUE|image_passe_partout{120,120}|image_recadre{120,120}
            ) ]  
        </li>
      </BOUCLE_articles1>
    </ul>
  </div>
  [<p class="pagination">(#PAGINATION|{prive})</p>]
</B_articles1>

BOUCLE 2 (avec javascript) :

<B_articles2>
  #ANCRE_PAGINATION
  <div class="avecscript">
    <ul>
      <BOUCLE_articles2(ARTICLES) {!par date} {pagination 25}>
        <li>
          [(#LOGO_ARTICLE_RUBRIQUE|image_reduire{120,*}) ]  
        </li>
      </BOUCLE_articles2>
    </ul>
  </div>
  [<p class="pagination">(#PAGINATION|{prive})</p>]
</B_articles2>

J’ai utilisé la solution suivante avec la balise noscript, mais le problème est que les 2 boucles sont calculées par spip est affichées en dur dans la page, bien que la deuxième ne soit pas affiché par le navigateur :

<!-- No Script -->
<div id="noscript">
  <noscript>
    <B_articles1>
    #ANCRE_PAGINATION
    <div class="sansscript">
      <ul>
        <BOUCLE_articles1(ARTICLES) {!par date} {pagination 25}>
          <li>
            [(#LOGO_ARTICLE_RUBRIQUE|image_passe_partout{120,120}|image_recadre{120,120}
            ) ]  
          </li>
        </BOUCLE_articles1>
      </ul>
    </div>
    [<p class="pagination">(#PAGINATION|{prive})</p>]
  </B_articles1>
  <style>.avecscript{display:none;}</style>
  </noscript>
</div>
 
<B_articles2>
  #ANCRE_PAGINATION
  <div class="avecscript">
    <ul>
      <BOUCLE_articles2(ARTICLES) {!par date} {pagination 25}>
        <li>
          [(#LOGO_ARTICLE_RUBRIQUE|image_reduire{120,*}) ]  
        </li>
      </BOUCLE_articles2>
    </ul>
  </div>
  [<p class="pagination">(#PAGINATION|{prive})</p>]
</B_articles2>

Avez-vous une meilleure solution ?

Merci,
Julien