HTML iframe - Bildlauf deaktivieren

Ich habe folgenden Iframe auf meiner Website:

<iframe src="<<URL>>" height="800" width="800" sandbox="allow-same-origin allow-scripts allow-forms" scrolling="no" style="overflow: hidden"></iframe>

Und es hat Bildlaufleisten.
Wie kann man sie loswerden?

Leider glaube ich nicht, dass es möglich ist, HTML5 nur mit HTML- und CSS-Eigenschaften vollständig anzupassen. Glücklicherweise unterstützen die meisten Browser die scrollingEigenschaft (die aus der HTML5-Spezifikation entfernt wurde ) weiterhin.

overflowist keine Lösung für HTML5, da der einzige moderne Browser, der dies fälschlicherweise unterstützt, Firefox ist.

Eine aktuelle Lösung wäre, beide zu kombinieren:

<iframe src="" scrolling="no"></iframe>

iframe {
  overflow: hidden;
}

Dies könnte jedoch veraltet sein, wenn die Browser aktualisiert werden. Möglicherweise möchten Sie dies für eine JavaScript-Lösung überprüfen: http://www.christersvensson.com/html-tool/iframe.htm

Bearbeiten: Ich habe überprüft und scrolling="no"werde in IE10, Chrome 25 und Opera 12.12 funktionieren.

Ich habe das gleiche Problem mit diesem CSS gelöst:

    pointer-events:none;

Es scheint mit zu funktionieren

html, body { overflow: hidden; }

im IFrame

bearbeiten: Natürlich funktioniert dies nur, wenn Sie Zugriff auf den Inhalt des Iframes haben (den ich in meinem Fall habe)

Stellen Sie den gesamten Inhalt auf:

#yourContent{
 width:100%;
height:100%;  // in you csss
}

Die Sache ist, dass die Iframe-Schriftrolle durch den Inhalt NICHT durch den Iframe selbst festgelegt wird.

Stellen Sie den Inhalt im Innenraum mit CSS auf 100% und den gewünschten für den Iframe in HTML ein

Ich habe versucht, in meinem aktuellen Browser (Google Chrome Version 60.0.3112.113 (Official Build) (64-Bit)) zu scrollen = "nein", und das hat nicht funktioniert. Scroll = "no" hat jedoch funktioniert. Könnte einen Versuch wert sein

<iframe src="<<URL>>" height="800" width="800" sandbox="allow-same-origin allow-scripts allow-forms" scroll="no" style="overflow: hidden"></iframe>

Fügen Sie diese Stile hinzu .. für Ihr Iframe-Tag ..

overflow-x:hidden;
overflow-y:hidden;

Da der "Überlauf: versteckt;" Die Eigenschaft funktioniert auf dem iFrame selbst nicht ordnungsgemäß, scheint jedoch Ergebnisse zu liefern, wenn sie auf den Hauptteil der Seite im iFrame angewendet wird. Ich habe Folgendes versucht:

iframe body { overflow:hidden; }

Welche überraschend hat die Arbeit mit Firefox, die lästigen Bildlaufleisten zu entfernen.

In Safari wurde jedoch auf der rechten Seite des Iframes zwischen seinem Inhalt und seinem Rand eine seltsame 2 Pixel breite transparente Linie angezeigt. Seltsam.

Fügen Sie einfach einen Iframe hinzu, der wie eine der folgenden Optionen gestaltet ist. Ich hoffe das löst das Problem.

1. Option:

<iframe src="https://www.skyhub.ca/featured-listing" style="position: absolute; visibility: hidden;" onload="this.style.position='static'; this.style.visibility='visible';" scrolling="no" frameborder="0" marginheight="0px" marginwidth="0px" height="400px" width="1200px" allowfullscreen></iframe>

2. Option:

<iframe src="https://www.skyhub.ca/featured-listing" style="display: none;" onload="this.style.display='block';" scrolling="no" frameborder="0" marginheight="0px" marginwidth="0px" height="400px" width="1200px" allowfullscreen></iframe>

Das funktioniert bei mir:

<style>
*{overflow:hidden!important;}
html{overflow:scroll!important;}
</style>

Hinweis: Wenn Sie in einem anderen Element eine Bildlaufleiste benötigen, fügen Sie {overflow:scroll!important;}diesem Element auch CSS hinzu

Für diesen Rahmen:

    <iframe src="" name="" id=""></iframe>

Ich habe dies mit meinem CSS-Code versucht:

    iframe#put the value of id here::-webkit-scrollbar {
         display: none;
    }

unter HTML5-Versionen

iframe {
    overflow:hidden;
}

In HTML5

<iframe seamless="seamless"  ....>


iframe[seamless]{

   overflow: hidden;
}

aber noch nicht richtig unterstützt

Sie können den folgenden CSS-Code verwenden:

margin-top: -145px; 
margin-left: -80px;
margin-bottom: -650px;

Um die Ansicht des Iframes einzuschränken.