Ответ 1
Добавьте в тег iframe следующие атрибуты:
marginheight="0" marginwidth="0" frameborder="0"
На 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.
Добавьте в тег iframe следующие атрибуты:
marginheight="0" marginwidth="0" frameborder="0"
У меня была такая же проблема с iframe, созданной динамически, и оказалось, что настройка свойств границы ПОСЛЕ, добавление iframe в документ имеет эффект НЕТ:
Следующий код показывает трехмерную рамку:
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);
Надеюсь, что это поможет решить вашу проблему.
Я пробовал множество вариаций этой идеи и в итоге использовал что-то в этом направлении. Думаю, я поделился бы этим.
<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, и все это круто для меня, и оно также проверяет.
Надеюсь, это поможет кому-то!
Успех!
Попробуйте это. Он найдет любые элементы iframe и удалит их границы в IE и других браузерах (хотя вы можете просто установить стиль "border: none;" в браузерах, отличных от IE, вместо использования JavaScript). И он будет работать, даже если используется ПОСЛЕ того, как iframe создается и находится в месте документа (например, iframes, которые добавляются в обычный HTML, а не JavaScript)!
Это работает, потому что IE создает границу, а не в элементе iframe, как вы ожидали, но в CONTENT iframe - после создания iframe в спецификации. ($ @& * # @!!! IE!!!)
Примечание. Часть IE будет работать только (конечно), если родительское окно и iframe находятся из ТОГО ИСТОЧНИКА (тот же домен, порт, протокол и т.д.). В противном случае script получит ошибки "отказа в доступе" в консоли ошибок IE. Если это произойдет, единственный вариант - установить его перед тем, как он будет сгенерирован, как отмечали другие, или использовать нестандартный атрибут frameBorder = "0". (или просто пусть IE выглядит уродливо - мой текущий любимый вариант;))
Взял меня МНОГИЕ часы работы до отчаяния, чтобы понять это...
Enjoy.:)
// =========================================================================
// 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.
}
}
Пример HTML, который будет использоваться с образцом JS, будет полезен =)
Попробуйте использовать инструменты разработчика IE8 (нажмите F12 на странице, с которой у вас возникли проблемы), чтобы выделить, какие стили применяются к iframe. Вы также можете играть со стилями там, чтобы сократить время итерации.
Имейте в виду, что IE может не соответствовать настройкам границы в css, , тогда как традиционная настройка атрибута BORDER=0
в элементе iframe может работать. Стоит проверить, по крайней мере.
Изменить: похоже, что проблема устраняет установку frameborder = '0' в элементе iframe. Это работало для меня, по крайней мере.
Если вы хотите, чтобы ваш код проверялся, вы можете сделать это с помощью 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);
f вы хотите загрузить другую страницу в 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 id и вызываете script при загрузке. Вот как.
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);