IE 8 iframe border

Question

На iframe есть граница, и я не могу от нее избавиться.

IE 6 и 7 работают как положено с небольшим количеством JavaScript:

function test(){
    var iframe = document.getElementById('frame2');
    iframe.contentWindow.document.body.style.backgroundColor = "#a31d1d";
    iframe.contentWindow.document.body.style.border = "#a31d1d";
    iframe.contentWindow.document.body.style.outlineColor = "#a31d1d";
}

Но граница остается видимой в IE 8.

Answer 1

Добавить следующие атрибуты в тег iframe:

marginheight="0" marginwidth="0" frameborder="0"

Answer 2

У меня была такая же проблема с динамически создаваемыми фреймами, и оказалось, что установка свойств границы ПОСЛЕ добавление фрейма в документ имеет НЕТ эффект:

Следующий код показывает 3d-рамку:

var iframe = document.createElement("IFRAME");
iframe.src = "http:www.stackoverflow.com";
//Iframe added BEFORE setting border properties.
document.body.appendChild(iframe);
iframe.frameBorder = "no";

Но это на самом деле удаляет его:

var iframe = document.createElement("IFRAME");
iframe.src = "http:www.stackoverflow.com";
iframe.frameBorder = "no";
//Iframe added AFTER setting border properties.
document.body.appendChild(iframe);

Надеюсь, что это поможет решить вашу проблему.

Answer 3

Успех!

Попробуй это. Он найдет любые элементы iframe и удалит их границы в IE и других браузерах (хотя вы можете просто установить стиль «border: none;» в браузерах не IE вместо JavaScript). И он будет работать, даже если он используется ПОСЛЕ того, как iframe сгенерирован и размещен в документе (например, iframe, которые добавляются в простом HTML, а не в JavaScript)!

Похоже, это работает, потому что IE создает границу не на элементе iframe, как вы ожидаете, а на СОДЕРЖАНИИ iframe - после создания iframe в спецификации. ($ @ & * # @ !!! IE !!!)

Примечание. Часть IE будет работать (конечно) только в том случае, если родительское окно и iframe происходят из ТОГО ЖЕ источника (тот же домен, порт, протокол и т. Д.). В противном случае скрипт получит ошибки «отказано в доступе» в консоли ошибок IE. Если это произойдет, ваш единственный вариант - установить его до того, как он будет сгенерирован, как отметили другие, или использовать нестандартный атрибут frameBorder = "0". (или просто позвольте IE выглядеть беспорядочно - мой любимый вариант;))

Мне потребовалось МНОГИЕ часы работы до отчаяния, чтобы понять это ...

Наслаждайтесь. :)

// =========================================================================
// Remove borders on iFrames

if (window.document.getElementsByTagName("iframe"))
   {
      var iFrameElements = window.document.getElementsByTagName("iframe");
      for (var i = 0; i < iFrameElements.length; i++)
         {
            iFrameElements[i].frameBorder="0";   //  For other browsers.
            iFrameElements[i].setAttribute("frameBorder", "0");   //  For other browsers (just a backup for the above).
            iFrameElements[i].contentWindow.document.body.style.border="none";   //  For IE.
         }
   }

Answer 4

Я попробовал множество вариантов этой идеи и в итоге использовал что-то в этом роде. Думал, что поделюсь этим.

<script type="text/javascript">
   url = 'http://www.dollypower.com';
   title = 'Dolly Power';
   width = '660';
   height = '430';
    document.write('<iframe src='+url+' title='+title+' width='+width+' height='+height+' frameborder=0></iframe>');
 </script>

Затем я использовал теги noscript, чтобы ввести альтернативу для пользователей, не являющихся JS, то есть:

<noscript><p><a href="http://www.dollypower.com" target="_blank">Please click here for Dolly Power</a></p></noscript>

Я проверил это в IE8, и это все круто для меня, и это также подтверждает.

Надеюсь, это может кому-то помочь!

Answer 5

Если вы хотите, чтобы ваш код был проверен, вы можете сделать это с помощью JavaScript. Я нашел идеальный ответ, когда у меня была эта проблема несколько месяцев назад здесь

var iframe = document.createElement("iframe");
 iframe.src = "banner_728x90.gif";
 iframe.width = "728";
 iframe.height = "90";
 iframe.frameBorder = "0";
 iframe.scrolling = "no";
 document.body.appendChild(iframe);

Если вы хотите загрузить еще одну страницу в iframe, вы можете сделать это, если скопируете и вставите этот код в заголовок своей страницы. Я нашел это на сайте с бесплатными скриптами. Производительность в большинстве случаев хорошая

function getDocHeight(doc) {
    doc = doc || document;
    var body = doc.body, html = doc.documentElement;
    var height = Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight );
    return height;
}
function setIframeHeight(id) {
    var ifrm = document.getElementById(id);
    var doc = ifrm.contentDocument? ifrm.contentDocument: ifrm.contentWindow.document;
    ifrm.style.visibility = 'hidden';
    ifrm.style.height = "10px"; // reset to minimal height in case going from longer to shorter doc
    ifrm.style.height = getDocHeight( doc ) + 10 + "px";
    ifrm.style.visibility = 'visible';
}

Затем вы присваиваете свой iframe идентификатор и вызываете скрипт при загрузке. Вот как.

var iframe = document.createElement("iframe");
 iframe.setAttribute('id', "ifrm1");
 iframe.setAttribute('src', 'http://www.hekcmviw.com/'); // change the URL
 iframe.setAttribute('width', '100%');
 iframe.setAttribute('height', '10');
 iframe.setAttribute('frameBorder', '0');
 iframe.setAttribute('scrolling', 'no');
 iframe.setAttribute('onload' ,"setIframeHeight(this.id)");
 document.body.appendChild(iframe);

Answer 6

Имейте в виду, что это может быть IE, не учитывающий настройки границ в css, , тогда как традиционная установка атрибута BORDER=0 в элементе iframe может работать. Стоит проверить, как минимум.

Edit: похоже, что проблема решается установкой frameborder = '0' в элементе iframe. Это сработало для меня, по крайней мере.

Answer 7

Будет полезен пример HTML для примера JS =)

Попробуйте использовать инструменты разработчика IE8 (нажмите F12 на странице, с которой у вас возникли проблемы), чтобы определить, какие стили применяются к iframe. Вы также можете поиграть со стилями, чтобы сократить время итерации.