jquery内置网络摄像头屏幕上的图像

我试图在我的网页上的摄像头屏幕上放置一个图像。我使用jQuery网络摄像头插件将网络摄像头屏幕放在我的网页上

链接到jQuery插件：

现在我想在屏幕上方放置一个图像，这样我就可以使网络摄像头屏幕不可见，或者在屏幕上方放置一个背景，这样看起来就像你在一棵树后面一样

---

有没有人知道如何做到这一点；我试着把图像放在上面，但网络摄像头总是放在上面。

一个简单的解决方案可能就是使用jQuery隐藏对象

假设它在

中，您可以使用：

 $('#webcam').hide();

然后在以后使用：

 $('#webcam').fadeIn(); // or .show();

但对于图像解决方案，您可以尝试以下方法：

 <div id="webcam">
    <div id="over_image"></div>
    <object id="webcam-object" type="application/x-shockwave-flash" data="/download/jscam_canvas_only.swf" width="320" height="240"><param name="movie" value="/download/jscam_canvas_only.swf"><param name="WMODE" value="transparent"> <param name="FlashVars" value="mode=callback&amp;quality=85"></object>
 </div>

 #webcam { width: 320px; height: 240px; position: relative; }
 #over_image { width: 320px; height: 240px; 
               position: absolute; z-index: 100; top: 0;
               background-image: url('someimage.jpg');
 }

请注意，您需要包括：

在flash对象中，我不确定jquery插件如何设置flash，因此您可能需要修改一些代码

如果不包括此项，

z-index

属性将无法正常工作。（这可能是您尝试的背景图像无法正常工作的原因。）