wake-up-neo.net

IE 8 Iframe-Grenze

Es gibt eine Grenze auf einer iframe und ich kann sie nicht loswerden.

IE 6 und 7 funktionieren wie beabsichtigt mit etwas 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";
}

Die Grenze bleibt jedoch in IE 8 sichtbar.

34
Terry

Fügen Sie dem iframe-Tag folgende Attribute hinzu:

marginheight="0" marginwidth="0" frameborder="0"
94
Assaf Feldman

Ich hatte das gleiche Problem mit dynamisch erstellten iframes, und es stellte sich heraus, dass die Einstellung der RahmeneigenschaftenNACHdas Hinzufügen des iframes zum DokumentNOeffect hat: 

Der folgende Code zeigt einen 3D-Rand: 

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

Aber das entfernt es tatsächlich:

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

Hoffen Sie, dass dies helfen würde, Ihr Problem zu lösen.

17
MK.

Erfolg!

Versuche dies. Es wird alle iframe-Elemente finden und deren Ränder in IE und anderen Browsern entfernen (Sie können jedoch in Nicht-IE-Browsern einen Stil von "border: none;" festlegen, anstatt JavaScript zu verwenden). UND es funktioniert auch, wenn es verwendet wird, nachdem der iframe im Dokument erstellt wurde (z. B. iframes, die in reinem HTML und nicht in JavaScript hinzugefügt werden)!

Dies scheint zu funktionieren, da IE den Rand nicht wie erwartet auf dem iframe-Element, sondern auf dem Inhalt des iframe erstellt, nachdem der iframe in der Stückliste erstellt wurde. ($ @ & * # @ !!! IE !!!)

Hinweis: Der IE - Teil funktioniert (natürlich) nur, wenn das übergeordnete Fenster und der iframe aus dem gleichen Ursprung stammen (gleiche Domäne, Port, Protokoll usw.). Andernfalls erhält das Skript in der Fehlerkonsole IE die Fehlermeldung "Zugriff verweigert". Ist dies der Fall, besteht die einzige Möglichkeit darin, den Wert vor der Generierung festzulegen, wie von anderen bemerkt, oder das nicht standardmäßige frameBorder = "0" -Attribut zu verwenden. (oder lassen Sie einfach IE flüchtig aussehen - meine derzeitige Lieblingsoption;))

Ich habe VIELE Stunden bis zur Verzweiflung gearbeitet, um das herauszufinden ...

Genießen. :)

// =========================================================================
// 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.
         }
   }
1
FirstFraktal

Ich habe viele Variationen dieser Idee ausprobiert und am Ende etwas in dieser Richtung verwendet. Ich dachte, ich würde es teilen.

<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>

Dann habe ich Noscript-Tags verwendet, um eine Alternative für Nicht-JS-Benutzer einzugeben, d. H .:

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

Ich habe es in IE8 getestet und es ist alles cool für mich und es validiert auch.

Hoffe, das könnte jemandem da draußen helfen! 

1
Rachel

Beachten Sie, dass dies IE sein kann, wenn Sie die Randeinstellungen in der CSS nicht berücksichtigen. die traditionelle Einstellung des Attributs BORDER=0 im iframe-Element kann jedoch funktionieren. Zumindest eine Prüfung wert.

Bearbeiten: Es sieht so aus, als ob das Frameborder = '0' für das iframe-Element festgelegt ist. Das hat zumindest für mich funktioniert.

0
Kzqai

Wenn Sie möchten, dass Ihr Code überprüft wird, können Sie dies mit Javascript tun. Ich fand die perfekte Antwort, als ich dieses Problem vor einigen Monaten hatte hier

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);

wenn Sie eine weitere Seite nahtlos in den Iframe laden möchten, können Sie dies tun, wenn Sie diesen Code kopieren und in den Kopf Ihrer Seite einfügen. Ich habe es auf einer Seite mit kostenlosen Skripten gefunden. Die Leistung ist in den meisten Fällen gut

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';
}

Dann geben Sie Ihrem iframe eine ID und rufen das Skript beim Laden auf. Das ist wie.

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);
0
Kevin Lynch

Beispiel-HTML für die Beispiel-JS wäre hilfreich =)

Verwenden Sie die IE8-Entwicklertools (drücken Sie auf der Seite, mit der Sie Probleme haben, die Taste F12), um zu ermitteln, welche Stile auf den iframe angewendet werden. Sie können auch mit den Styles dort spielen, um die Iterationszeit zu verkürzen.

0