Bagaimana cara menanamkan file SWF di halaman HTML?


Jawaban:


174

Pendekatan terbaik untuk menanamkan SWF ke dalam halaman HTML adalah dengan menggunakan SWFObject .

Ini adalah pustaka JavaScript open-source sederhana yang mudah digunakan dan metode yang ramah standar untuk menyematkan konten Flash.

Ini juga menawarkan deteksi versi Flash player. Jika pengguna tidak memiliki versi Flash yang diperlukan atau JavaScript dinonaktifkan, mereka akan melihat konten alternatif. Anda juga dapat menggunakan perpustakaan ini untuk memicu pemutakhiran Flash player. Setelah pengguna memutakhirkan, mereka akan diarahkan kembali ke halaman.

Contoh dari dokumentasi:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <title>SWFObject dynamic embed - step 3</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <script type="text/javascript" src="swfobject.js"></script>

    <script type="text/javascript">
        swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0");
    </script>

  </head>
  <body>
    <div id="myContent">
      <p>Alternative content</p>
    </div>
  </body>
</html>

Alat yang baik untuk digunakan bersama ini adalah generator SWFObject HTML dan JavaScript . Ini pada dasarnya menghasilkan HTML dan JavaScript yang Anda butuhkan untuk menanamkan Flash menggunakan SWFObject. Hadir dengan UI yang sangat sederhana untuk Anda memasukkan parameter Anda.

Sangat disarankan dan sangat mudah digunakan.


11
Proyek SWFO bagus. Itu hanya bekerja. Ide yang lebih hebat adalah menggunakan Jaringan Pengiriman Konten untuk mendapatkan javascript. Saya menggunakan ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js
Ardee Aram

Saya punya masalah dengan menggunakan tag objek langsung dengan IE9 tetapi berfungsi dengan baik dengan swfobject.
AndyMcKenna

Terima kasih atas jawaban anda. Sekarang dapatkah Anda menyarankan pemain juga untuk mengakses kemampuan pemutaran bersama dengan contoh yang berfungsi di html itu sendiri. ????
Sumit Ramteke

Apakah ini berfungsi pada sistem di mana flash player tidak diinstal atau mendukung semua browser.
Mohammed Javed

Proyek ini sekarang dipindahkan ke GitHub: github.com/swfobject/swfobject dan teknik baru untuk menanamkan objek swf adalahvar el = document.getElementById("my-target-element"); swfobject.embedSWF("myContent.swf", el, 300, 120, 10);
Lucky

127
<object width="100" height="100">
    <param name="movie" value="file.swf">
    <embed src="file.swf" width="100" height="100">
    </embed>
</object>

1
Kode itu bukan XHTML-valid ... <embed> tidak boleh berada dalam tag-objek.
Anheledir

59
Tidak ada spesifikasi pengguna yang valid untuk XHTML, ia meminta HTML
Ólafur Waage

3
artikel ini memiliki penjelasan yang baik tentang menanamkan flash dan XHTML yang valid. yoast.com/articles/valid-flash-embedding
Joko Wandiro

3
mengapa tidak menggunakan dataatribut dalam elemen <object> ? Kutipan dari w3c html5 docs: Setidaknya satu dari atribut data atau atribut type harus ada.
vladkras

@JokoWandiro tautan yang Anda berikan sayangnya hilang. Inilah versi yang diarsipkan: web.archive.org/web/20180602024700/https://yoast.com/…
Hermann.Gruber

17

Bagaimana dengan embed tag HTML5 sederhana?

<!DOCTYPE html>
<html>
<body>

<embed src="anim.swf">

</body>
</html>

13

Ini cocok untuk aplikasi dari lingkungan root.

<object type="application/x-shockwave-flash" data="/dir/application.swf" 
id="applicationID" style="margin:0 10px;width:auto;height:auto;">

<param name="movie" value="/dir/application.swf" />
<param name="wmode" value="transparent" /> <!-- Or opaque, etc. -->

<!-- ↓ Required paramter or not, depends on application -->
<param name="FlashVars" value="" />

<param name="quality" value="high" />
<param name="menu" value="false" />

</object>

Parameter tambahan harus / dapat ditambahkan yang tergantung pada .swf sendiri. Tidak ada embed , hanya objek dan parameter di dalamnya, jadi, itu tetap valid, berfungsi dan dapat digunakan di mana-mana, tidak masalah yang mana! DOCTYPE adalah semua tentang. :)


8
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/VhtIydTmOVU&amp;hl=en&amp;fs=1&amp;color1=0xe1600f&amp;color2=0xfebd01" 
style="width:640px;height:480px;margin:10px 36px;">

<param name="movie" value="http://www.youtube.com/v/VhtIydTmOVU&amp;hl=en&amp;fs=1&amp;color1=0xe1600f&amp;color2=0xfebd01" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="wmode" value="opaque" />
<param name="quality" value="high" />
<param name="menu" value="false" />

</object>

2
Perhatikan bahwa objek> data dan film> parameter nilai adalah sama. Kode ini dapat digunakan secara gratis untuk menonton dan berbagi - video youtube.
Seram

3
Secara umum, diinginkan jawaban untuk menjelaskan kode yang mereka berikan, bukan hanya menjatuhkan kode pada penanya. Tujuannya adalah untuk belajar tentang masalah dan mencegahnya di masa depan daripada membuatnya hilang.
KRyan

7

Jika Anda menggunakan salah satu perpustakaan js untuk memasukkan Flash, saya sarankan menambahkan tag embed objek polos di dalamnya <noscript/>.




2

Yang ini akan berhasil, saya yakin!

<embed src="application.swf" quality="high" pluginspage="http://www.macromedia.com/go/getfashplayer" type="application/x-shockwave-flash" width="690" height="430">

1

Apakah cara terbaiknya? Kata-kata seperti 'paling efisien,' 'rendering tercepat,' dll. Lebih spesifik. Lagi pula, saya menawarkan jawaban alternatif yang membantu saya sebagian besar waktu (apakah 'terbaik' tidak relevan).

Alternatif jawaban: Gunakan iframe.

Yaitu, host file SWF di server. Jika Anda meletakkan file SWF di folder root atau public_html maka file SWF akan berlokasi di www.YourDomain.com/YourFlashFile.swf.

Kemudian, pada index.html Anda atau di mana saja, tautkan lokasi di atas ke iframe Anda dan itu akan ditampilkan di sekitar konten Anda di mana pun Anda meletakkan iframe Anda. Jika Anda dapat meletakkan iframe di sana, Anda dapat meletakkan file SWF di sana. Jadikan dimensi iframe sama dengan file SWF Anda. Dalam contoh di bawah ini, file SWF adalah 500 oleh 500.

Kode palsu:

<iframe src="//www.YourDomain.com/YourFlashFile.swf" width="500" height="500"></iframe>

Baris kode HTML di atas akan menyematkan file SWF Anda. Tidak perlu kekacauan lain. Kelebihan: W3C compliant, ramah desain halaman, tidak ada masalah kecepatan, pendekatan minimalis.
Cons: Ruang putih di sekitar file SWF Anda ketika diluncurkan di browser.

Itu jawaban alternatif. Apakah itu jawaban 'terbaik' tergantung pada proyek Anda.


3
untuk google @Stoic maaf kesalahan Anda itu harus //www...menggunakan //berarti bahwa jika Anda pada HTTPS atau HTTP ia bekerja menggunakan jenis koneksi yang sama
Barkermn01

1

Saya tahu ini adalah pertanyaan lama. Tetapi jawaban ini akan baik untuk saat ini.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>histo2</title>
        <style type="text/css" media="screen">
        html, body { height:100%; background-color: #ffff99;}
        body { margin:0; padding:0; overflow:hidden; }
        #flashContent { width:100%; height:100%; }
        </style>
    </head>
    <body>
        <div id="flashContent">
            <object type="application/x-shockwave-flash" data="histo2.swf" width="822" height="550" id="histo2" style="float: none; vertical-align:middle">
                <param name="movie" value="histo2.swf" />
                <param name="quality" value="high" />
                <param name="bgcolor" value="#ffff99" />
                <param name="play" value="true" />
                <param name="loop" value="true" />
                <param name="wmode" value="window" />
                <param name="scale" value="showall" />
                <param name="menu" value="true" />
                <param name="devicefont" value="false" />
                <param name="salign" value="" />
                <param name="allowScriptAccess" value="sameDomain" />
                <a href="http://www.adobe.com/go/getflash">
                    <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
                </a>
            </object>
        </div>
    </body>
</html>

1

Ini bekerja pada IE, Edge, Firefox, Safari dan Chrome.

<object type="application/x-shockwave-flash" data="movie.swf" width="720" height="480">
            <param name="movie" value="movie.swf" />
            <param name="quality" value="high" />
            <param name="bgcolor" value="#000000" />
            <param name="play" value="true" />
            <param name="loop" value="true" />
            <param name="wmode" value="window" />
            <param name="scale" value="showall" />
            <param name="menu" value="true" />
            <param name="devicefont" value="false" />
            <param name="salign" value="" />
            <param name="allowScriptAccess" value="sameDomain" />
            <a href="http://www.adobe.com/go/getflash">
                <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
            </a>
        </object>

0

Ini bekerja untuk saya:

    <a target="_blank" href="{{ entity.link }}">
        <object type="application/x-shockwave-flash" data="{{ entity.file.path }}?clickTAG={{ entity.link }}" width="120" height="600" style="visibility: visible;">
            <param name="quality" value="high">
            <param name="play" value="true">
            <param name="LOOP" value="false">
            <param name="wmode" value="transparent">
            <param name="allowScriptAccess" value="true">
        </object>
    </a>

0

Gunakan <embed>elemen:

<embed src="file.swf" width="854" height="480"></embed>

-1

Anda dapat menggunakan JavaScript jika Anda terbiasa, seperti itu:

swfobject.embedSWF("filename.swf", "Title", "width", "height", "9.0.0");

--the 9.0.0 adalah versi flash.

Atau Anda dapat menggunakan <object>tag HTML5.


-1 swfobject bukan hanya bagian dari JavaScript, Anda tidak bisa menyebutnya begitu tanpa menyematkan perpustakaan. dan sebagian besar fungsionalitas untuk tag <object> telah dihapus dari HTML 4 hingga 5. Ini masih dapat digunakan, tetapi tidak disarankan. Semua dalam semua jawaban yang sangat buruk.
rorypicko

apakah Anda sudah mencobanya sebelum mengatakan itu jawaban yang sangat buruk? perlu diingat bahwa jawaban yang sangat buruk, adalah jawaban yang tidak sepenuhnya berfungsi atau salah.
Allan

fakta bahwa Anda memberi tahu seseorang untuk menggunakan javascript, dan kemudian menempelkan kode menggunakan pustaka javascript yang bahkan belum Anda sebutkan menjadikannya jawaban yang buruk
rorypicko

Saya sudah menyebutkan menggunakan Javascript dan memberikan skrip. Jika saya memberikan seluruh kode / skrip kerja yang membuat spoonfeeding. Script baik-baik saja hanya logikanya.
Allan

Anda salah memahami komentar saya. Anda belum mengatakan kepadanya untuk memasukkan file Javascript SWFObject
rorypicko
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.