Wie eine swf auf einer HTML-Seite einzubetten?

StackOverflow https://stackoverflow.com/questions/300200

  •  08-07-2019
  •  | 
  •  

Frage

Ich mag eine swf über eine HTML-Seite einbetten, wie ein schwimmenden Viedeo-Panel. Ich habe bereits eine SWF-Datei, die automatisch die Größe entsprechend der Browsergröße anpassen, und die SWF-Datei ist teilweise transparent. Ich dachte, ich kann nur einen div-Tag hinzufügen, stellen Sie die Position absolut und ändere z-index größer, aber das funktioniert nicht, weil die swf einfach alles ersetzt, die auf der Seite ist.

Hier ist, was ich tat, 

<script>
      swfobject.embedSWF("swf/float.swf", "header", "100%", "100%", "9.0.0");
</script>

<body bgcolor="#000000">
      <div id="header"></div>
      <div id="shell">
          things in my html
      </div>
</body>

#header {
    position:absolute;
    z-index:100;

}

Jede Idee? Danke.

War es hilfreich?

Lösung

Wenn Sie Ihre Dimensionierung erhalten richtig funktioniert, müssen Sie das wmode auf transparent der Lage sein, zu sehen, was hinter dem Blitz ist, wenn Sie dies nicht tun, es ist Hintergrund wird undurchsichtig.

Dies ist eine kurze Copypaste aus dem swfobject docs , aber es sollte erhalten der Punkt über: 

<script type="text/javascript">

var flashvars = {};
var params = {wmode : "transparent"};
var attributes = {};

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

</script>

Andere Tipps

Ich glaube, das Problem dabei ist, dass der CSS nicht gut mit <object /> Tags funktioniert. Die swfobject.embedSWF schaltet den <div id="header"></div> in einen <object /> Tag mit einer Menge von Attributen, die die CSS werden bewirken könnten. Wenn Sie einen Wrapper DIV um den Header DIV erstellen und die CSS an den Wrapper DIV anwenden, funktioniert alles besser. Sie müssen auch 100% Breite und Höhe in der CSS hinzuzufügen. Hier ist die überarbeitete Quelle: 

<script>
    swfobject.embedSWF("swf/float.swf", "header", "100%", "100%", "9.0.0");
</script>

<body bgcolor="#000000">
    <div id="wrapper">
        <div id="header"></div>
        </div>
    <div id="shell">
        things in my html
    </div>
</body>

#wrapper {
    position:absolute;
    z-index:100;
    width:100%;
    height:100%;
}
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top