{"id":2384,"date":"2013-08-12T11:40:06","date_gmt":"2013-08-12T15:40:06","guid":{"rendered":"http:\/\/www.underwater.ca\/blog\/?p=2384"},"modified":"2018-09-22T06:25:13","modified_gmt":"2018-09-22T10:25:13","slug":"vimeoembedder","status":"publish","type":"post","link":"https:\/\/www.underwater.ca\/blog\/vimeoembedder\/","title":{"rendered":"vimeoEmbedder.js: Embed and extend the customization of the Vimeo player using jQuery"},"content":{"rendered":"

<\/a><\/p>\n

vimeoEmbedder is a jQuery plugin that helps artists and designers present their Vimeo videos on websites the way they want them to.<\/h3>\n

vimeoEmbedder.js<\/a> 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<\/a> has a host of configuration options that can be extended beyond the Vimeo player\u2019s native abilities:<\/p>\n

vimeoColor<\/h3>\n

Changes the color scheme of the Vimeo player (including play button, progress bar and volume levels).<\/p>\n

image<\/h3>\n

URL to a JPG\/PNG poster image to display before the Vimeo video is loaded and playback is started.<\/p>\n

playButtonColor<\/h3>\n

Sets the background color of the poster image play button.<\/p>\n

vimeoBackground<\/h3>\n

Assign a background color for the Vimeo player.<\/p>\n

vimeoID<\/h3>\n

Input the Video ID that is assigned to your video file at Vimeo.com. (copy the URL or ID from your web browser\u2019s address bar while viewing the video on Vimeo.)<\/p>\n

width<\/h3>\n

Width of the player in pixels (defaults to 480 pixels).<\/p>\n

height<\/h3>\n

Height of the player in pixels (defaults to 270 pixels).<\/p>\n

I plan to expand the jQuery video plugin\u2019s functionality and flexibility as new ideas arise. Please feel free to contribute to the plugins at it\u2019s github<\/a> destination. I am also open for feedback and ideas for future iterations of the plugin at jason@jasonsafir.com<\/a>.<\/p>\n

Click here<\/a> to view documentation for the vimeoEmbedder.js plugin
\nDownload<\/a> the vimeoEmbedder.js plugin (ZIP)<\/p>\n","protected":false},"excerpt":{"rendered":"

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 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5,12,4],"tags":[],"class_list":["post-2384","post","type-post","status-publish","format-standard","hentry","category-news","category-tutorials","category-video"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/posts\/2384","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/comments?post=2384"}],"version-history":[{"count":40,"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/posts\/2384\/revisions"}],"predecessor-version":[{"id":2745,"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/posts\/2384\/revisions\/2745"}],"wp:attachment":[{"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/media?parent=2384"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/categories?post=2384"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.underwater.ca\/blog\/wp-json\/wp\/v2\/tags?post=2384"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}