vimeoEmbedder.js: Embed and extend the customization of the Vimeo player using jQuery

August 12th, 2013 | BY JASON SAFIR

vimeoEmbedder is a jQuery plugin that helps artists and designers present their Vimeo videos on websites the way they want them to.

vimeoEmbedder.js is a lightweight jQuery plugin designed to help give artists and designers creative control over how their Vimeo videos are presented on the web. In addition to simplifying the process of embedding and styling the presentation of Vimeo videos, vimeoEmbedder.js has a host of configuration options that can be extended beyond the Vimeo player’s native abilities:

vimeoColor

Changes the color scheme of the Vimeo player (including play button, progress bar and volume levels).

image

URL to a JPG/PNG poster image to display before the Vimeo video is loaded and playback is started.

playButtonColor

Sets the background color of the poster image play button.

vimeoBackground

Assign a background color for the Vimeo player.

vimeoID

Input the Video ID that is assigned to your video file at Vimeo.com. (copy the URL or ID from your web browser’s address bar while viewing the video on Vimeo.)

width

Width of the player in pixels (defaults to 480 pixels).

height

Height of the player in pixels (defaults to 270 pixels).

I plan to expand the jQuery video plugin’s functionality and flexibility as new ideas arise. Please feel free to contribute to the plugins at it’s github destination. I am also open for feedback and ideas for future iterations of the plugin at jason@jasonsafir.com.

Click here to view documentation for the vimeoEmbedder.js plugin
Download the vimeoEmbedder.js plugin (ZIP)