masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > Tutorial H5 > Kod berdasarkan HTML5 cool camera (HTML5 webcam) fungsi kamera pelaksanaan kemahiran kod_html5 tutorial

Kod berdasarkan HTML5 cool camera (HTML5 webcam) fungsi kamera pelaksanaan kemahiran kod_html5 tutorial

WBOY
Lepaskan： 2016-05-16 15:50:42
asal
1652 orang telah melayarinya

photobooth demo - gbin1.com

WebRTC mungkin standard HTML5 yang paling banyak ditonton tahun depan Mozilla telah membangunkan satu set API untuk membantu anda mengawal perkakasan, seperti kamera, mikrofon atau pecutan. Anda boleh menghubungi peranti perkakasan asli yang anda perlukan tanpa bergantung pada pemalam lain.

Dalam artikel hari ini, kami akan memperkenalkan Photobooth.js yang dibangunkan oleh Wolfram Hempel Menggunakan perpustakaan kelas ini boleh membantu anda memanggil fungsi kamera dengan cepat dan anda boleh menambahkan fungsi kamera ke tapak web dengan mudah. Dan ia dengan cepat membantu anda mengambil foto Anda boleh menggunakan fungsi ini untuk mengambil foto pengguna.

Ciri Utama:
    Tetapan kontras tetapan warna tetapan kecerahan tetapan rona butang foto tetapan menyokong pelayar krom, firefox, opera dan pelayar lain yang terkini menyokong kaedah pemalam jQuery dan kaedah kod javascript

浏览器支持 - gbin1.com

Selepas menggunakan Chrome untuk membuka demo dalam talian, sila sahkan untuk membenarkan penyemak imbas memanggil kamera anda, seperti berikut:

基于HTML5实现的超酷摄像头（HTML5 webcam）拍照功能 - photobooth.js

Kod Javascript:

Salin kod
Kodnya adalah seperti berikut:

$(' #webcam' ).photobooth().on("image",function( event, dataUrl ){
$('.nopic').hide();
$( "#pictures" ).prepend( '< img src="' dataUrl '" >');
});

Kod di atas akan menghantar data imej yang dijana kepada teg dengan id=picture. Sila rujuk API yang berkaitan untuk mendapatkan arahan khusus.
Muat turun kod sumber

Kami harap anda semua menyukai demonstrasi dan demo dalam talian yang kami sediakan ini Jika anda mempunyai sebarang pertanyaan, sila tinggalkan mesej kepada kami, terima kasih!

Label berkaitan：
bergambar
sumber：php.cn
Artikel sebelumnya：Ringkasan pembangunan dan aplikasi antara muka api penentududukan lokasi geografi dalam kemahiran tutorial html5_html5 Artikel seterusnya：Lukisan laluan kanvas dan menyelaraskan contoh aplikasi transformasi kemahiran tutorial html5_html5
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...
daripada 2024-04-29 11:01:01
0
3
2184
Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?
daripada 2024-04-23 00:22:19
0
11
2331
Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.
daripada 2024-04-19 15:37:47
0
1
1961
Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...
daripada 2024-04-18 23:52:34
0
1
1845
Di manakah perisian kursus tentang pemetaan minda CSS? Perisian kursus
daripada 2024-04-16 10:10:18
0
0
1897
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan