Динамическое изменение таблицы на странице

Вроде код работает, но есть одна проблема.

Код (Text):

1.  
2. <script type="text/javascript">
3. $b = document.documentElement.clientWidth;
4. alert($b);
5. if($b<=800)
6. document.write('<img src="../img/1_14.2.jpg" /><img src="../img/1_14.3.jpg" /><img src="../img/1_14.4.jpg" /><img src="../img/1_14.5.jpg" />');
7. else
8. {
9.  document.write('<table><tr><td><img src="../img/1_14.2.jpg" />
10. </td><td><img src="../img/1_14.3.jpg" /></td></tr><tr><td>
11. <img src="../img/1_14.4.jpg" /></td><td>
12. <img src="../img/1_14.5.jpg" /></td></tr></table>');
13. }
14. </script>

У меня монитор 19 дюймов и открыто окно браузера на всю страницу.
У меня в результате этого кода, нарисуется табличка 2Х2.
Если у меня будет открыто окно браузера шириной меньше 800 пикселей, у меня каждая картинка перейдёт на другую строку.

Как мне сделать чтоб когда я открою окно браузера на весь экран, а потом буду уменьшать его до меньше 800 шириной сработал скрипт, а не только при обновлении страницы?

 

Попробовал так, не помогает.

Код (Text):

1.  
2. <script type="text/javascript">
3. function sec(){
4. $b = document.documentElement.clientWidth;
5. alert($b);
6. if($b<=800)
7. document.write('<div align="center"><img src="../img/1_14.2.jpg" /><img style="padding:5px;" src="../img/1_14.3.jpg" /><img src="../img/1_14.4.jpg" /><img style="padding:5px;" src="../img/1_14.5.jpg" /></div>');
8. else
9.    {
10.  document.write('<table cellspacing="5"><tr><td><img src="../img/1_14.2.jpg" /></td><td><img src="../img/1_14.3.jpg" /></td></tr><tr><td><img src="../img/1_14.4.jpg" /></td><td><img src="../img/1_14.5.jpg" /></td></tr></table>');
11.     }
12. }
13. setInterval(sec(),500);
14.  
15. </script>

 

Попробовал написать так, при уменьшении окна браузера, всё что находится за переделами:
<script>.......</script> пропадает, а только одни кратинки показываются в изменённом виде.

Код (Text):

1.  
2. <script type="text/javascript">
3. window.onresize = sec;
4. function sec(){
5. $b = document.documentElement.clientWidth;
6. alert($b);
7. if($b<=1240)
8. document.write('<div align="center"><img src="../img/1_14.2.jpg" /><img style="padding:5px;" src="../img/1_14.3.jpg" /><img src="../img/1_14.4.jpg" /><img style="padding:5px;" src="../img/1_14.5.jpg" /></div>');
9. else
10.    {
11.  document.write('<table cellspacing="5"><tr><td><img src="../img/1_14.2.jpg" /></td><td><img src="../img/1_14.3.jpg" /></td></tr><tr><td><img src="../img/1_14.4.jpg" /></td><td><img src="../img/1_14.5.jpg" /></td></tr></table>');
12.     }
13. }
14. setInterval(sec(),1);
15.  
16. </script>

 

Ребята, кто-нибудь подскажет как исправить,никто не знает?