Skip to content
A jQuery plugin that allows taking pictures with a webcam
JavaScript CSS
Branch: master
Clone or download
Latest commit 913b001 Jan 29, 2016
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
LICENSE Initial commit Jan 29, 2016
README.md Update README.md Jan 29, 2016
jquery.jqcam.css Create jquery.jqcam.css Jan 29, 2016
jquery.jqcam.js Update jquery.jqcam.js Jan 29, 2016

README.md

jQueryWebcam

A jQuery plugin that allows taking pictures with a webcam.

Inspired by http://www.xarg.org/project/jquery-webcam-plugin/ but this one doesn't use flash. Instead it uses an html video tag to provide the camera feed and a canvas to convert it to a picture.

NOTE: the plugin only exposes an html img element as the result, further manipulation of that image (like posting it to a webserver) has to be done via a user defined callback.

Requires jQuery and Jcrop (http://deepliquid.com/content/Jcrop.html)

Usage

Imports:

<link rel="stylesheet" href="css/jquery.Jcrop.css" type="text/css"/>
<link rel="stylesheet" href="css/jquery.jqcam.css" type="text/css"/>

<script src="js/jquery.js"></script>
<script src="js/jquery.Jcrop.js"></script>
<script src="js/jquery.jqcam.js"></script>

Html element (container):

<div id="cam"></div>

Invocation:

$('#cam').jqcam({
    camWidth: 640,
    camHeight: 480
    // further options
});

Options

Options are provided as an object when calling jqcam

  • picFormat picture export format. Default is jpg.
  • cropperDimensions an array with 4 numbers representing the area covered by the cropper. Default is [5, 5, 250, 313].
  • cropperSelectable wether the user will be able to define a new cropper area themselves. Default is false.
  • cropperResizable wether the user will be able to resize the original or user defined cropper area. Default is false.
  • camWidth width of the camera feed. Default is 320
  • camHeight height of the camera feed. Default is 240
  • processCroppedFunction a function that will be called when the user clicks the button of the cropped picture. Default just alerts that the function was not specified.

References

You can’t perform that action at this time.