html5 - nachteile - iframe seamless




HTML5 iFrame Nahtloses Attribut (7)

Aktualisiert: Oktober 2016

Das seamless Attribut existiert nicht mehr. Es wurde ursprünglich so eingestellt, dass es in der ersten HTML5-Spezifikation enthalten ist, wurde aber anschließend gelöscht. Ein nicht verwandtes Attribut mit demselben Namen machte einen kurzen Cameo im HTML5.1-Entwurf, aber auch das wurde Mitte 2016 gelöscht:

Also denke ich, dass das Wesentliche sowohl von der Implementorseite als auch von der Web-Dev-Seite darin liegt, dass seamless wie spezifiziert nicht das zu sein scheint, was irgendjemand anfangen wollte. Oder zumindest ist es mehr als jeder eigentlich wollte. Und wie @annevk sagt, es scheint, dass vieles davon seit "Ereignissen" im Lichte von Shadow DOM "überwunden wurde".

Mit anderen Worten: Löschen Sie das seamless Attribut aus Ihrem Speicher und geben Sie vor, dass es nie existiert hat.

Für die Nachwelt, hier ist meine ursprüngliche Antwort von vor fünf Jahren:

Ursprüngliche Antwort: April 2011

Das Attribut befindet sich momentan im Entwurfsmodus. Aus diesem Grund unterstützt derzeit keiner der aktuellen Browser es (da sich die Implementierung ändern kann). In der Zwischenzeit ist es am besten, CSS zu verwenden, um die Rahmen / Scrollbalken vom iFrame zu entfernen:

iframe[seamless]{
    background-color: transparent;
    border: 0px none transparent;
    padding: 0px;
    overflow: hidden;
}

Das Seamless-Attribut hat mehr zu bieten als das, was mit CSS hinzugefügt werden kann: Ein Teil des Grundgedankens hinter dem Attribut bestand darin, verschachtelten Inhalt die gleichen Stile zu erben, die auf den Iframe angewendet wurden (so als ob das eingebettete Dokument innerhalb des Elements verschachtelt wäre). beispielsweise).

Schließlich erfordern Versionen von Internet Explorer (8 und früher) zusätzliche Attribute, um die Rahmen, Bildlaufleisten und Hintergrundfarbe zu entfernen:

<iframe frameborder="0" allowtransparency="true" scrolling="no" src="..."></iframe>

Natürlich wird dies nicht bestätigt. Es liegt also an Ihnen, wie Sie damit umgehen. Mein (wählerischer) Ansatz wäre, die Agentenzeichenfolge zu schnüffeln und die Attribute für IE-Versionen vor 9 hinzuzufügen.

Ich hoffe, das hilft. :)

In HTML5 hat der Iframe neue Attribute wie "seamless", die Ränder und Bildlaufleisten entfernen sollten. Ich habe es ausprobiert, scheint aber nicht zu funktionieren. Ich kann weiterhin Bildlaufleisten und Ränder sehen (ich verwende Google Chrome als Browser), hier mein Code:

<iframe seamless="seamless" title="google" width="600" height="300" src="http://www.google.co.uk"></iframe>

Irgendeine Idee, warum es nicht funktioniert?

Noch eine Frage, ist es möglich, einen bestimmten Bereich der Seite innerhalb des Iframes zu erreichen?



Gemäß der neuesten W3C HTML5-Empfehlung (die wahrscheinlich der endgültige HTML5-Standard ist), die heute veröffentlicht wurde, gibt es kein seamless-Attribut mehr im Iframe-Element . Es scheint irgendwo im Standardisierungsprozess entfernt worden zu sein.

Laut caniuse.com kein großer Browser dieses Attribut (mehr), daher sollten Sie es wahrscheinlich nicht verwenden.


Ich dachte, das könnte für jemanden nützlich sein:

In der Chrome-Version 32 wird automatisch ein 2-Pixel-Rahmen um Iframes ohne das Seamless-Attribut angezeigt. Es kann leicht entfernt werden, indem diese CSS-Regel hinzugefügt wird:

iframe:not([seamless]) { border:none; }

Chrome verwendet den gleichen Selektor mit diesen Standard-User-Agent-Stilen:

iframe:not([seamless]) {
  border: 2px inset;
  border-image-source: initial;
  border-image-slice: initial;
  border-image-width: initial;
  border-image-outset: initial;
  border-image-repeat: initial;
}

Immer noch bei 2014 nahtlose Iframe wird nicht vollständig von allen gängigen Browsern unterstützt, so sollten Sie nach einer alternativen Lösung suchen.

Im Januar 2014 wird der nahtlose Iframe für Firefox weder IE 11 noch von Chrome, Safari und Opera (der Webkit-Version) unterstützt.

Wenn Sie diese und weitere unterstützte Optionen im Detail überprüfen möchten, wäre die HTML5-Testseite eine gute Option:

http://html5test.com/results/desktop.html

Sie können verschiedene Plattformen überprüfen, im Punktebereich können Sie auf jeden Browser klicken und sehen, was unterstützt wird und was nicht.


Sie müssen nur schreiben

nahtlos

in deinem Code. Es gibt keine Notwendigkeit für:

nahtlos = "nahtlos"

Ich habe das gerade selbst herausgefunden.

BEARBEITEN - Scrollbalken werden nicht entfernt. Seltsam

scrolling = "no" scheint immer noch in html5 zu funktionieren. Ich habe versucht, die Überlauffunktion mit einem Inline-Stil wie von HTML5 empfohlen, aber das funktioniert nicht für mich.






attributes