個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

無料で利用できるhtml5プレイヤー(jQueryプレイヤー)14(2013)

html5のお陰で、プラグインなしでビデオ、音楽を導入できるようになりました。
iPhoneは今後もFlashを導入しそうにないので、html5を使ってビデオ、音楽を公開する機会はますます増えそうです。
html5プレイヤーに対応していない古いブラザーに対してはjQueryで対応しています。
今回は、そんなhtml5プレイヤー(jQueryプレイヤー)のうち、無料で利用できるプレイヤーをご紹介します。

※KYUBIブログ様が2014年7月25日に「HTML5 jQuery Audio Player プラグインに脆弱性」という記事を書かれています。ご利用の際はご一読のうえ、ご活用ください。

jPlayer

jPlayer
無料で利用できるMITライセンスのプレーヤー。
クラスプラットフォームなプレイヤーです。
More Info
Demo

Open Standard Media (OSM) Player

Open-Standard-Media-OSM-Player
YouTubeやViemoなどのプレイヤーを統合したようなメディアプレイヤーフレームワーク。
MITライセンス。
More Info
Demo

Open Video Player

Open-Video-Player
いいとこどりのプレイヤーとの解説が。
More Info
Demo

jQuery YouTube TubePlayer Plugin

jQuery-YouTube-TubePlayer-Plugin
HTML5でつくられたYouTube実装用のjQueryプラグイン。
More Info
Demo

OIPlayer jQuery plugin

OIPlayer-jQuery-plugin
javaとflashのフォールバック用html5プレイヤー。
More Info
Demo

MediaElement.js

MediaElement
vide要素とaudio要素でつくれたシンプルなプレイヤー。
More Info
Demo

Videojs

video-js
オープンソースのHTML5動画プレイヤーで、
プレイヤーを埋め込むためのJavaScriptライブラリ。
More Info
Demo

JW Player

JW-Player
もっとも人気のあるビデオオプレイヤー。
現在までに200万サイト以上で利用されています。
商用の場合はライセンスの購入が必要。
More Info
Demo

IWishQuery : jQuery HTML5 audio Player

iwish
シンプルなオーディオプレイヤー用jQueryプラグイン。
More Info
Demo

jQuery Video Lightbox

jQuery-Video-Lightbox
ドラッグ&ドロップだけでhtml5ビデオを生成できるジェネレーター。
More Info
Demo

jMP3 (javaScript MP3 player)

jmp3
jsでつくられたmp3プレイヤー。
More Info
Demo

LeanBack Player

LeanBack-Player
html5 videoとaudioメディアプレイヤーを基礎としたjs製プレイヤー。
非商用でのみ無料。
More Info
Demo

mb.miniAudioPlay

miniAudioPlay
音楽再生用プラグイン。
More Info
Demo

A Responsive Audio Player jQuery Plugin for Mobiles

A-Responsive-Audio-Player-jQuery-Plugin-for-Mobiles
レスポンシブ対応のオーディオプレイヤー。
More Info
Demo

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 9
  • 30

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

Bootstrapの無料テーマを探すなら一箇所で全部探せる「ThemeFinder」

Bootstrapの無料テーマを探すなら一箇所でまとめて探せる「ThemeFinder」

Bootstrapの無料テーマを探すなら一箇所でまとめて探せる「ThemeFinder」をご紹介しま

記事を読む

レスポンシブ対応のコンテンツスライダー/スライドショーベスト8

以前の記事「レスポンシブ対応などコンテンツスライダー/スライドショー用jQueryプラグイン50+」

記事を読む

今さら聞けない!作業時間を短縮するChrome用ショートカットベスト・コレクション

ブラウザはChromeを使ってます。 そのChromeでサイトを制作したり、ブログを書いたりしてい

記事を読む

クリックしたくなる!CSSだけで作られた無料のボンタコレクション「CSS Buttons」

クリックしたくなる!CSSだけで作られた無料のボンタコレクション「CSS Buttons」

CSSだけで作られた無料のボタンがコレクションされている便利なサイトをご紹介します。 Photos

記事を読む

レスポンシブ対応などコンテンツスライダー/スライドショー用jQueryプラグイン50+

サイトのコンテンツをリッチに見せるだけでなく、省スペースで数多くのコンテンツを効率的・効果的に表示で

記事を読む

WEBサイトの背景に幾何学的なポリゴンアニメーションを簡単に実装できる「particles.js」

WEBサイトの背景に幾何学的なポリゴンアニメーションを簡単に実装できる「particles.js」

流行っているのかどうか定かではありませんが、海外のサイトなどで最近よく見かける幾何学的なポリゴンアニ

記事を読む

動画にCSSだけで色調補正エフェクトをかけた「dynamically colorize videos」は必見

動画にCSSだけで色調補正エフェクトをかけた「dynamically colorize videos」は必見

動画にCSSだけで色調補正エフェクトをかけた「dynamically colorize videos

記事を読む

コード/js不要!ドラッグ&ドロップだけでCSSイメージスライダーがつくれるアプリ「cssSlider.com」

コード/js不要!ドラッグ&ドロップだけでCSSイメージスライダーがつくれるアプリ「cssSlider」

イメージスライダーは限られたスペースに多くの視覚的情報を盛り込めるので、ショップなどでは非常によく利

記事を読む

左右からメニューがスルッ!CSSだけで作れらたオフカンバスメニュー

左右からメニューがスルッ!CSSだけで作成されたオフカンバスメニュー6

CSSだけで作られたオフカンバスメニューをまとめてご紹介します。 「オフカンバスメニュー」は、ボタ

記事を読む

人気のHTML/CSSコードサンプル25+おまけ2 from CodePen

CodePenはHTML,CSS,JSのコードサンプル配布サイトです。 紹介されているコードの種類

記事を読む