Bootstrap Modal中的Webcam JS

时间:2016-07-21 14:46:30

标签: javascript jquery webcam

我正在为网络摄像头使用jhuckaby / webcamjs jquery插件。

我使用Bootstrap模式加载网络摄像头。

但Adobe通知不会在引导模式中自动填充。

通知图片是:

enter image description here

当我直接加载没有模态

的相机div时,通知正在加载

JQuery的

 var swfURL = '@Url.Content("~/Scripts/jscam.swf")';
  $("#Camera").webcam({
                width: 320,
                height: 240,
                mode: "save",
                swffile: swfURL,
                onLoad: function () {
                    $("#SubmitPic").on("click", webcam.capture);
                },
                onTick: function () {
                },
                onSave: function () {
                    UploadPic();
                },
                onCapture: function () {
                    webcam.save(captureImageSaveURL);
                },
                debug: function () { },
            });

HTML 模态

<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header model-bg">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h4 class="modal-title">Take Picture</h4>
            </div>
            <div class="take-photo">
                <div style="border: 4px solid #ccc; padding: 5px">
                    <div id="Camera" style="height: 240px; width: 100%;"></div>
                    <div class="col-lg-12">
                        <center>
                            <button type="button" class="btn btn-default" style="color:#fff;" id="SubmitPic" name="command" value="Capture" onclick="clickCapture();">
                                <span class="glyphicon glyphicon-camera"></span>@Resources.VMSResource.Capture
                            </button>
                        </center>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

按钮

 <div class="fileUpload btn btn-primary cam-al">
                                        <a href="#" style="color: #fff; text-decoration: none;" data-toggle="modal" data-target="#myModal">
                                            <img src="../Images/cam.png" alt="cam" style="z-index: 9999;">
                                            <span style="color: #fff;">@Resources.VMSResource.TakePhoto</span>
                                            <input type="button" id="Capture" name="command" value="Reset" class="upload">
                                        </a>
                                    </div>

请协助我解决问题。

0 个答案:

没有答案