Скрипт для расширения таблицы и фрейма - PullRequest
Новая
       22

Скрипт для расширения таблицы и фрейма

0 голосов
/ 13 апреля 2011

У меня есть скрипт, который расширяет ширину iframe в таблице. Код работал раньше и работает в Internet Explorer. Функция javascript - это вызов по нажатию стрелки раскрытия.

Это код таблицы: 

<table cellspacing="0" cellpadding="0" style="border: 1px solid #000000;">
    <tbody>
        <tr>
            <td style="background-color: rgb(232, 226, 210);border-bottom-style: solid;border-right-style:solid;border-width:1px;border-bottom-style:solid;border-width:1px;">
                <p class="headings">
                    iWannaGo.co Best Deals 
                    <a onClick="setContract()" title="Minimise Fares Window">
                    <img alt="<" width="20" height="20" src="/wp-content/themes/thesis_18/custom/images/left.png"></a>
                    Expand
                    <a onClick="setExpand()" title="Maximise Fares Window">
                        <img alt=">"  width="20" height="20" src="/wp-content/themes/thesis_18/custom/images/right.png" >
                    </a>
                </p>
            </td>
            <td style="background-color: rgb(232, 226, 210);border-bottom-style:solid;border-width:1px;">
                <p class="headings">Compare Recommended Sites</p>
            </td>
        </tr>
        <tr>
            <td id="fare" style="border-right-style:solid;border-width:1px;vertical-align:top;">
                <iframe src="<?php echo $search_fb; ?>" id="farebuzz" scrolling="auto" width=800 height=400 frameborder="0" align="left" style="overflow-x: hidden;padding-left:10px;padding-right:10px;"></iframe>
              </td>
            <td id="bwix">
                <iframe src="<?php echo $search_bw; ?>" id="bwiz" scrolling="auto" width=300 height=300 frameborder="0"  style=""> </iframe>
            </td>
        </tr>
    </tbody>
</table>

Тогда функция JavaScript. 

 function setExpand() {
      var iframeElement = parent.document.getElementById('farebuzz');
      var iframeElements = parent.document.getElementById('bwiz');
      var tableElement = document.getElementById('fare');  
      var tableElements = document.getElementById('bwix'); 
      iframeElement.style.height = 400; 
      iframeElement.style.width = 960;
      iframeElements.style.width=150;
      tableElement.style.width=960;
      tableElements.style.width=150; 
 }
 function setContract() {
      var iframeElement = parent.document.getElementById('farebuzz');
      var iframeElements = parent.document.getElementById('bwiz');
      var tableElement = document.getElementById('fare');  
      var tableElements = document.getElementById('bwix'); 
      iframeElement.style.height = 400;
      //100px or 100% 
      iframeElement.style.width = 800;
      //100px or 100% 
      tableElement.style.width=800;
      tableElements.style.width=300;
      iframeElements.style.width=300; 
 }
 function expanddiv() { 
      var padElements = document.getElementById('pad');  
      padElements.style.display='block'; 
 }

Вот рабочая и не рабочая форма кода:

В IE работает расширение для работы с ссылками. действительно сбивает с толку.

1 Ответ

2 голосов
/ 13 апреля 2011

Вы не можете установить style.width на число, оно должно быть строкой и должно включать суффикс px: 

iframeElement.style.height = "400px";

Редактировать: Также,рассмотрите возможность кодирования угловых скобок в атрибуте alt вашего изображения.Это должно быть: 

<img alt="&lt;" ... />
<img alt="&gt;" ... />

Возможно, это не вызывает непосредственных проблем сейчас, но, безусловно, может произойти в обозримом будущем.Уже испортилось форматирование кода SO.: -)

...