刷新相机流jQuery
[英]Refresh camera stream jquery
问题描述
i'm using getUserMedia to display the webcam stream in a div. 
我正在使用getUserMedia在div中显示网络摄像头流。 I'm trying to apply some CSS effects to the video stream, like filter : blur(15px); 我正在尝试将一些CSS效果应用于视频流，例如filter : blur(15px); and some other CSS effects. 和其他一些CSS效果。
The problem is that the effect doesn't work, when i'm applying the class, but it works if it's loaded like if it's on .effect0 at the loading of the page. 问题是，当我应用该类时，该效果不起作用，但是如果它的加载效果像在页面加载时在.effect0上一样，则效果很好。
Does anybody know how i can refresh only the camera stream to see the effect, and can explain to me how to include it in my code ? 有人知道我如何只刷新摄像机流以查看效果，并且可以向我解释如何将其包括在代码中吗？
Thanks a lot if you read me and thanks again if you help ! 非常感谢您阅读我的信息，再次感谢您的帮助！
My code : 我的代码：
var video = document.querySelector("#videoElement"); navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia || navigator.oGetUserMedia; if (navigator.getUserMedia) { navigator.getUserMedia({ video: true }, handleVideo, videoError); } function handleVideo(stream) { video.src = window.URL.createObjectURL(stream); } function videoError(e) { // do something } $('.bouton0').click(function () { $('#videoElement').removeClass('.effet1'); $('#videoElement').addClass('.effet0'); }); $('.bouton1').click(function () { $('#videoElement').removeClass('.effet0'); $('#videoElement').addClass('.effet1'); });
#container { margin: 0px auto; margin-top: 10%; } #videoElement { width: 100%; height: 100%; background-color: #666; } .effet0 { filter: none; } .effet1 { filter: blur(15px); } ul li { display: inline-block; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <body> <ul> <li><a href="#" class="bouton0">effet 0</a></li> <li><a href="#" class="bouton1">effet 1</a></li> </ul> <div id="container"> <video autoplay="true" id="videoElement" class=""> </video> </div> </body>
1 个解决方案
解决方案1
0 2016-12-12 02:06:57
May be $().removeClass('.effet1'); -> $().removeClass('effet1'); 可能是$().removeClass('.effet1'); -> $().removeClass('effet1'); $().removeClass('.effet1'); -> $().removeClass('effet1');
Other also. 其他也。 :) :)
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.