使用flash插件來呼叫pc的攝影機如何將它嵌入到TML頁面中_HTML/Xhtml_網頁製作
之所以寫這篇文章,主要是因為組長給提的一個新的需求——使用瀏覽器調用電腦的攝像頭,來實現即時拍照的功能。在網路上查了很多資料,由於這樣或那樣的原因,最後選擇了使用flash插件來呼叫pc的攝影機。當然,這個需求是基於B/S架構的,因此,就在想怎麼把它嵌入到前端的HTML頁面中。
題外話
當然,這裡還沒有考慮到封裝,主要是先以實現為目的,後續工作再根據業務進行抽象,封裝成通用的組件。好了,廢話不多說,看重點。
嵌入插件
使用object 和embed 標籤
代碼展示
codebase="http://fpdownload. /pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0"
width="490" height="390" id="Untitled-1" align="middle">
type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" / >
這個方法用到的是Object 和Embed 標籤,可以看到object 的很多參數和embed 裡面的很多屬性是重複的。瀏覽器相容性,有的瀏覽器支援 object,有的支援 embed,這也是為什麼要修改 Flash 的參數時兩個地方都要改的原因。這種方法是 Macromedia 一直以來的官方方法,最大限度的保證了 Flash 的功能,沒有相容性問題。
但現在來看,它還是存在很大問題的。
首先,無法通過驗證,由於為了相容性而嵌入的 embed 標籤是不符合 W3C 的規範的。當然,如果你不在乎什麼規範不規範,另當別論。
其次,微軟由於種種原因,在 sp2 後限制了 IE 的 ActiveX 的使用模式,就是在頁面中的 ActiveX 有一個虛框,需要用戶點擊一次才能正常互動。 Flash是作為一個 ActiveX 嵌入到網頁中的,所以它也會被牽連,只有透過 JS 嵌入 Flash 才能解決這個問題。
再,沒有Flash 版本檢測,如果版本瀏覽器的flash插件版本不夠,或者不能正常顯示你的swf 文件,或者會彈出一個ActiveX 的確認安裝的框——這個框對很多用戶來說是很恐怖的。
只使用object 標籤
代碼展示
這個方法只用到了Object 標籤,其實也就是Flash satay。嵌入Flash 的方法,瀏覽器相容性也不錯,看起來幾乎完美,不過還是有問題的。你需要透過flashvars 來傳參,或者和頁面的JS 交互,會很麻煩。
再一次,有些低版的瀏覽器(如低版的Safari等)不認同這種方式,對它的相容性不好。 🎜>
程式碼展示
複製程式碼
程式碼如下:
這種方法只用到了Embed 標籤,對比效果來說,還是很不錯的,瀏覽器的兼容性也還不錯,都是可以載入的。當然,由於 embed 標籤是不符合 W3C 的規範的,所以也不建議使用這種方法。
使用JavaScript嵌入
使用 JS 來載入 Flash 插件,網路上已經有很多的方法了,而且也有很多不錯的 JS 插件供大家選擇。我這裡只拿 SWFObject 來簡單的介紹一下。
首先,你需要下載一個 SWFObject 插件包,該插件包中包含一個 JS 腳本,這個是你需要引入的腳步文件。還包括兩個 html 的例子,大家可以模仿一下。當然,你也可以去 SWFObject 的網站了解一下,網址請點 這裡 。
程式碼展示
效果圖
結束語

對比這幾種方式,我更推薦使用JS 嵌入的方式來加載Flash 插件,這種方式不僅能保證實現Flash 的所有功能,同時在各瀏覽器的兼容性方面也都表現不錯,並且JS 還可以提供更多的擴展功能,更主要是可以被更多的人復用,減少不必要的冗餘代碼。 外掛程式下載位址:
SWFObject

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

谷歌瀏覽器不支援flash插件怎麼辦?如今不少用戶都在使用谷歌瀏覽器,部分用戶在使用谷歌瀏覽器的是偶會彈出提示“AdobeFlashPlayer已被屏蔽”頁面,這種情況下我們需要在設置里手動打開FlashPlayer,那麼具體的操作方法是什麼呢?相信大家都想知道吧。下面就請小編跟大家說說解決不支援flash外掛問題方法介紹,有需要的朋友趕快來學習一下吧。解決不支援flash插件問題方法介紹1、點擊Google瀏覽器右上角圖標,如圖所示。 2、在跳出的對話框中點選設置,如圖所示。 3.點擊隱私設定和安全性,然

我們很多用戶在使用Edge瀏覽器的時候都安裝了flash插件,但是還是無法自動播放視頻,需要用戶手動在進行操作,那麼要怎麼設置才能夠自動播放,針對這個問題,本期小編就來分享兩種操作方法,希望今天的軟體教學內容能幫助各位解決問題。 Edge瀏覽器flash插件無法自動播放解決方法: 方法一: 1、雙擊進入軟體,點選頁面中的「...」按鈕。 2、在下方給出的選項清單中選擇「設定」。 3、點選新介面中的「進階」選項。 4、

QQ瀏覽器提示未安裝flash外掛程式怎麼辦? flash插件是能夠支援大家在瀏覽器裡查看圖片和影片的,一般情況下瀏覽器裡自帶有flash插件,不過最近有不少QQ瀏覽器用戶在使用的時候頁面提示未安裝flash插件,導致很多內容無法正常顯示,那麼我們該如何解決這個問題。接下來小編就帶給大家QQ瀏覽器未安裝flash外掛解決方案,希望能對大家有幫助。 QQ瀏覽器未安裝flash插件解決方案1、開啟QQ瀏覽器,如圖點擊右上角的「選單」圖標,如下圖所示。 2、這時會彈出一個二級選單,將滑鼠移到「工具」這一

谷歌瀏覽器如何安裝flash插件?在大部分瀏覽器中都需要安裝flash插件,這個插件支援圖片和影片等多媒體的閱讀,用戶想要在谷歌瀏覽器裡查看圖片或影片就需要安裝flash插件,不少用戶對這個插件並不了解,具體在谷歌瀏覽器裡如何安裝很多人都不知道。接下來小編就帶給大家Google瀏覽器安裝flash外掛操作步驟,有需要的朋友不妨來看看了解一下。 Google瀏覽器安裝flash外掛程式操作步驟1、我們在百度搜尋框中輸入adobeflashplayer官方下載,我們點擊可以下載的連結進去(如圖)。 2、我們在點選「

火狐瀏覽器怎麼安裝flash插件?我們要如何在火狐瀏覽器裡安裝flash插件,具體的方法步驟是什麼!我們在使用火狐瀏覽器觀看電影,玩遊戲的時候,網頁都會提示我們要安裝flash插件才能正常使用,那麼我們應該如何安裝這個插件呢,具體的操作方法是什麼,小編下面正整理了火狐瀏覽器安裝flash插件方法步驟,如果你不會操作的話,就跟著我我往下看吧!火狐瀏覽器怎麼安裝flash插件1、百度搜尋adobeflashplayer官網,點選進入,如下圖所示2、進入flash插件安裝頁面,點選【立即安裝】3、、f

edge瀏覽器怎麼安裝flash插件?在用戶使用瀏覽器上網過程中,flash插件發揮很大的作用,它能夠幫助用戶載入圖片、影片等等的內容,幫助用戶更方便的上網。 edge瀏覽器為使用者提供了新增插件的功能,那麼使用者該如何在edge瀏覽器上方新增flash插件呢?沒有操作過的用戶也許不懂,那麼今天小編就為大家帶來了非常詳細的微軟瀏覽器安裝flash插件技巧,有興趣的話就來一起學習吧。微軟瀏覽器安裝flash插件技巧1、進入免費的微軟瀏覽器,點擊頁面頂部工具列中的三個點圖標,如下圖所示。 2、在下方給出的

edge瀏覽器怎麼啟用flash?在使用edge瀏覽器的時候如果想要啟用flash該怎麼操作?使用edge瀏覽器看電視玩遊戲的時候,都需要用到flash這個功能,小編下面整理了edge瀏覽器啟用flash具體步驟,有需要的小夥伴一起往下看看吧。 啟用方法 1、進入瀏覽器,點選頁面上方工具列右側的三個點圖示。 2、接著在下方給出的選項選單中選擇「設定」。 3、進入新介面後,點選「預設瀏覽器」選項,然後在右側找到「允許在Intern

火狐瀏覽器沒有flash插件怎麼辦?火狐瀏覽器具有非常穩定的特性,不少用戶喜歡使用這款瀏覽器辦公,我們在瀏覽器裡瀏覽圖片或者視頻的時候需要flash插件支持,部分用戶在查看圖片的時顯示沒有flash插件,這種情況我們需要在火狐瀏覽器裡安裝一個flash插件。接下來小編就帶給大家火狐瀏覽器解決沒有flash插件問題詳細教程,有興趣的朋友快來看看。火狐瀏覽器解決沒有flash插件問題詳細教程首先,您需要將Firefox瀏覽器點開,然後在頁面的右上角的地方將【擴展】圖標按鈕點擊打開,接著進入到擴展
