Bonjour à tous,

Je cherche a faire un truc de compliqué..., pour moi.

Je dois mettre des images de maniere a ce qu'elles soient conforme a bootstrap. TinyMCE ne me permets pas de faire ceci, alors je cherche a faire un "hack"

J'ai ce code
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
<pre class="Style1">
<img width="200" height="200" alt="Equipements sportifs" src="/files/Images/eqp-spotifs.png">
<img width="200" height="200" alt="Equipements sportifs" src="/files/Images/eqp-spotifs.png">
<img width="200" height="200" alt="Equipements sportifs" src="/files/Images/eqp-spotifs.png">
</pre>

J'aimerais faire en sorte que jQuery déterct la balise <pre> dans ma page.
S'il voit un <pre> qui englobe des images, comme ci-dessus,
J'aierais qu'il remplace
1. <pre> par <div class="row"> et </pre> par </div>
2. Qu'il compte le nombre d'image
3. et qu'il ajoute d'autres div autour des image
pour avoir au final
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
 
<!-- Dans le cas de trois images -->
<div class="row">
<div class="col-md-4 span4>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
<div class="col-md-4 span4>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
<div class="col-md-4 span4>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
</div>
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
 
<!-- Dans le cas de deux images -->
<div class="row">
<div class="col-md-6 span6>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
<div class="col-md-6 span6>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
 
</div>
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
<!-- Dans le cas de 4 images -->
<div class="row">
<div class="col-md-3 span3>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
<div class="col-md-3 span3>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
<div class="col-md-3 span3>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
<div class="col-md-3 span3>
<img width="200" height="200" alt="Equipements sportifs" src="/sogemat/files/Images/eqp-spotifs.png">
</div>
 
</div>
etc.

Es-ce enorme de faire ce code?
Pourriez-vous mettre sur la piste des fonction jQuery a utiliser?