Comment remplacer du code HTML par de l'autre
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:
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:
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:
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:
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?
