JavaScript-powered Screen Recording Tool – ScreenRecorderJs

Preview:

Description:

ScreenRecorderJs is a JavaScript-powered screen recording tool for all web browsers. It is built on the MediaDevices API and therefore does not require Flash or any other plugins to work.

It enables you to record webpages, games, web apps, and compiled code in a full-featured, easy-to-use way. Its main goal is to be simple and lightweight, so you can focus on your work instead of dealing with complicated settings.

See Also:

• Record Your Screen And Generate A GIF With JavaScript – gifcap

How to use it:

1. Create an empty HTML5 video into which the ScreenRecorderJs capture your browser’s screen.

<video src="" class="hide" id="video" width="600px" controls autoplay loop></video>

2. Create a Record button to star capturing the screen.

<button class="record-btn">Record</button>

3. Create a Stop button to exit the Recording mode and save the video as a webm file.

<button class="stop-btn hide">Stop</button>

4. Hide the Stop button on page load.

.hide{
  display: none;
}

5. Load the main script recorder.js at the end of the document. That’s it.

<script defer="true" src="./assets/js/recorder.js"></script>