WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
HTML5 / Media

HTML5 Blue Video Gallery

— アドオンWorldWideScripts.netへ

@ja1wws日付まで滞在するために私達のフィードを購読する!

新しい!あなたがそれを望むように私たちに従ってください!


HTML5 Blue Video Gallery - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

envato AftESSサポートフォーラムFASTSI.FPORT

イントロ

すべてのブラウザ(でもIE8)で動作し、カスタマイズするには、インストールが簡単でビデオギャラリーをしたい、YouTubeの(最新の標準(HTML5)、動画共有プロバイダから供給することができる、あまりにもマルチメディアサポート(音声/画像)を、持っている次第です/ Vimeoの)? そして、これはあなたのサイトに動画を紹介するビデオギャラリーです。

フラッシュフォールバックを介してIEを含む - ギャラリーはすべての主要なブラウザ環境で動作します。 また、ビデオ·ギャラリー内の単一の映像を入力することにより、ビデオプレーヤーとなります。

このギャラリーには、最新のHTML5 tehniquesを使用しています。 例えば、 - それはあなたが終了する前に、あなたが持っていた最後のボリュームを覚えてHTML5のlocalStorageを使用し、あなたが戻ってきたときに、そのボリュームをバックに設定します。 皮膚は、単純なCSSを介してセットアップされている - それは、基本的なCSSで完全に皮膚ができます

アップデート

UPDATE 8.00 [2014年9月22日]

  • [FIX]いくつかのバグ

UPDATE 7.50 [2014年4月8日]

  • [TWEAK]は今よりスムーズな移行します
  • [TWEAK]プレビュー更新

UPDATE 7.44 [2014年3月26日]

  • [FIX]複数のバグ
  • [FIX]プレビュー
  • [FIX]字幕のサポートを追加

UPDATE 6.78 [2013年10月14日]

  • [FIX]複数のバグ

UPDATE 6.10 [2013年10月2日]

  • [修正] YouTubeのビデオのエンディングでバグ、音声がまだ再生されました
UPDATE 5.11 [2013年10月2日]
  • 致命的なIE9 / IE10のバグを修正
  • 移行プラグインなしでのjQuery 1.9.1で動作するように更新
UPDATE 5.00 [2013年1月10日]
  • YouTubeの動画のHDボタンを追加しました
  • (プレビューでYouTubeチャンネルデモを確認してください)​​メニューthumbsandarrowsをスクロールするための新しい方法を追加しました
  • 回転子、rotator3dと壁 - 3新しいモードを追加しました
  • ギャラリーやプレイヤーのスキンは今独立しています
  • 追加された新しいギャラリースキン - nav_transparent - メニュー項目の円形と透明ナビゲーション
  • プレーヤーのための追加された新しい素晴らしいスキン - オーロラ
  • 更新されたドキュメント
  • 他のバグが修正され
UPDATE 4.10 [2012年10月22日]
  • 固定フルスクリーンバグ(サファリ、クロム、Firefoxと将来の準拠のブラウザで完璧に動作します)
  • 広告サポートを追加 - 画像/ YouTubeや動画広告
  • 他のバグが修正され
UPDATE 4.0 [2012年5月2日]
  • いくつかのバグを修正
  • 変更されたビデオギャラリーとビデオプレーヤーのDOM構造
  • 新しいバッファリングバーを追加しました
  • Vimeoのサポートを追加しました
  • 追加されたオーディオのサポート
  • 追加されたイメージのサポート
  • 追加された埋め込みボタン
  • 追加された共有ボタン
  • クロム、サファリ、Firefoxのための本当のフルスクリーンを追加しました
UPDATE 3.0 [2012年2月23日]
  • いくつかのバグを修正
  • 再編のドキュメント
  • 変更されたビデオギャラリーとビデオプレーヤーのDOM構造

UPDATE 2.0 [2011年7月9日]

  • いくつかのバグを修正
  • のiPod /アプリ/ iPhoneがサポート
  • 最新のHTML5の標準に更新

特徴

  • ビデオに焦点を当てて - フルスクリーンボタンをクリックすると、ブラウザウィンドウ全体に映像を楽しむのを聞かせて
  • HTML5パワード - HTML5のvideo要素&ジャバスクリプトのlocalStorageは、この最先端のギャラリーを作ります
  • あなたの好みを覚えて - このプレーヤーは、あなたが設定した最後のボリュームを格納するためにHTML5のlocalStorageのを使用していますので、あなたがページを閉じて、後でそれを開くと、ボリュームがすぐに戻ってあなたがそれをしたところであります
  • IEを含むすべての主要なブラウザとの互換性は - videoタグをサポートしていないブラウザのためのフラッシュフォールバックを提供し、それが見えるように、フラッシュビデオプレーヤーがデフォルトのと同じ皮膚を持っている(あなたがFlashVarsを介して再生するためにどのビデオを指定することができます)すべてのプラットフォームで同じ
  • iphone / ipadとの互換性 -このギャラリーは、リンゴのタッチデバイスに最適化されています
  • CSS駆動のスキン - それはあなた自身の肌を作ることは非常に簡単ですので、機能的でestethic - ギャラリーCSSは2つの部分に分割されます

    資産

    -からのビデオhttp://www.bigbuckbunny.org/

    よくある質問

    第1回ビデオが正常に動作しますが、2番目のビデオがまったく読み込まれません
    おそらくあなたがテストしていると同じYouTubeのビデオを添付しています。 あなたは2の場所で同じYouTubeのビデオを持つことはできません。
    どのように私はそれにVimeoのリンクを埋め込むのですか?
    ただvideogallery-CONの内部にこのマークアップを追加
     の<divクラス= "VPLAYER [ビューポート画層管理] - 砥部「データvideoTitle = 'Vimeoのビデオのデータ型=" Vimeoの「データ·SRC = "31539657">の<divクラス= "menuDescription"> <IMG SRC = "のhttp:// dummyimage.COM / 50×50/000000 / FFF&テキスト=親指 "クラス=" imgblock "/>の<divクラス="タイトル ">これは、サムネイルを自動生成することができますVimeoのビデオ</ DIV>です... </ div> </ DIV> 
    あなたのVimeoのビデオのIDとデータのsrc値を変更
    これは、VimeoのやYouTubeにされていない動画に使用することはできますか? 私は、直接にリンクしたいのですが、サーバー上でホストされているいくつかのビデオを持っています。 私はできるだけ早くお知らせください。 どうも
    確かに、それは、自己ホスト型のビデオを再生するために特別に作られています。 YouTubeやVimeoのはちょうどボーナスです。
    どのように私は、ソーシャルメディアのアイコンが動作するように取得するのですか?
    vGallery機能の設定shareCodeをチェック
    どのように私は私の映像が正しくこのギャラリー内で使用するために符号化するのですか?

    あなたの映画はすべてのブラウザで確認してくださいHTML5の動画の再生を行うために、2の形式に変換必要

    ブラウザのサポート&推奨符号化プログラム

    IE9、IE8(フラッシュ)&サファリ:M4V - > http://handbrake.fr/

    クローム&オペラ&Firefoxの :OGG-> http://video.online-convert.com/convert-to-ogg

    ビデオDOM構造

     の<divクラス= "VPLAYER [ビューポート画層管理]"データ記述=「マイビデオ」データIMG = "IMG / 1.JPG"> <ビデオコントロールは、プリロード> <ソースSRC = "ビデオ/ myvideo.m4v" /> <ソースSRC = "ビデオ/ myvideo.ogg" /> <オブジェクトの種類=「アプリケーション/ X-衝撃波フラッシュ」データ= "preview.swf"幅= "550"高さ= "300" ID = "flashcontent"スタイル= "可視性:目に見えます;"> ます。<param name = "映画"値= "preview.swf">の<param名= "メニュー"値= "false"と>の<param名= "のallowScriptAccess"値= "常に"> ます。<param name = "スケール"値= "noScaleに">の<param名= "allowFullScreen"値= "真">の<param名= "wmodeを"値= "不透明"> ます。<param name =が "flashvars"の値= "ビデオ=ビデオ/ myvideo.m4v"> </オブジェクト> </ビデオ> </ DIV> 

    私はギャラリーwhitinそれを追加するにはどうすればよい、私のビデオの準備ができていますか?

    あなたがHTMLと一致していない場合などによるものであることを学習するための最良の方法。 オープンソース/ index.htmlを、ライン122の周りにあなたが表示されます。

    [..]
    の<divクラス= "VPLAYER [ビューポート画層管理]"データ記述= "<IMG SRC = 'IMG / thumb.png「クラス=' imgblock '/>ビデオ5」のデータ-IMG =" IMG / 1.JPG ">

    <ビデオコントロールは、プリロード>
    <ソースSRC = "ビデオ/ test.mp4"タイプ= '映像/ MP4; コーデック= "avc1.42E01E、mp4a.40.2" '/>
    <ソースSRC = "ビデオ/ test.webm"タイプ= '映像/ WEBM。 コーデック= "VP8、Vorbisの" '/>
    <ソースSRC = "ビデオ/ test.ogg"タイプ= '映像/ OGG。 コーデック= "Theoraの、Vorbisの" '/>
    <ソースSRC = "ビデオ/ bubbles.m4v" />

    <オブジェクトの幅= "500"高さ= "300">
    ます。<param name = "映画"値= "preview.swf?ビデオ=ビデオ/ advideo.flv"> </ param>の
    ます。<param name = "allowFullScreen"値= "真"> </ param>の
    ます。<param name = "のallowScriptAccess"値= "常に"> </ param>の
    ます。<param name = "wmodeを"値= "不透明"> </ param>の
    <EMBED SRC = "preview.swf?ビデオ=ビデオ/ advideo.flv"タイプ= "アプリケーション/ X-衝撃波フラッシュ"幅= "500"高さ= "300"のallowScriptAccess = "常に" allowfullscreen = "true"とのwmode = 「不透明な」>
    </ EMBED>
    </オブジェクト>
    </ビデオ>
    </ DIV>

    </ div> <! -ENDビデオギャラリー - >

    これは、ギャラリー内の最後のビデオを表し、それはそうのは、そのクローンを作成し、代わりにビデオ5のビデオ6という名前を付けましょう良い例です

    [..]
    の<divクラス= "VPLAYER [ビューポート画層管理]"データ記述= "<IMG SRC = 'IMG / thumb.png「クラス=' imgblock '/>ビデオ5」のデータ-IMG =" IMG / 1.JPG ">

    <ビデオコントロールは、プリロード>
    <ソースSRC = "ビデオ/ test.mp4"タイプ= '映像/ MP4; コー​​デック= "avc1.42E01E、mp4a.40.2" '/>
    <ソースSRC = "ビデオ/ test.webm"タイプ= '映像/ WEBM。 コー​​デック= "VP8、Vorbisの" '/>
    <ソースSRC = "ビデオ/ test.ogg"タイプ= '映像/ OGG。 コー​​デック= "Theoraの、Vorbisの" '/>
    <ソースSRC = "ビデオ/ bubbles.m4v" />

    <オブジェクトの幅= "500"高さ= "300">
    ます。<param name = "映画"値= "preview.swf?ビデオ=ビデオ/ advideo.flv"> </ param>の
    ます。<param name = "allowFullScreen"値= "真"> </ param>の
    ます。<param name = "のallowScriptAccess"値= "常に"> </ param>の
    ます。<param name = "wmodeを"値= "不透明"> </ param>の
    <EMBED SRC = "preview.swf?ビデオ=ビデオ/ advideo.flv"タイプ= "アプリケーション/ X-衝撃波フラッシュ"幅= "500"高さ= "300"のallowScriptAccess = "常に" allowfullscreen = "true"とのwmode = 「不透明な」>
    </ EMBED>
    </オブジェクト>
    </ビデオ>
    </ DIV>
    の<divクラス= "VPLAYER [ビューポート画層管理]"データ記述= "<IMG SRC = 'IMG / thumb.png「クラス=' imgblock '/> ビデオ6"データIMG = "IMG / 1.JPG">

    <ビデオコントロールは、プリロード>
    <ソースSRC = "ビデオ/ test.mp4"タイプ= '映像/ MP4; コーデック= "avc1.42E01E、mp4a.40.2" '/>
    <ソースSRC = "ビデオ/ test.webm"タイプ= '映像/ WEBM。 コーデック= "VP8、Vorbisの" '/>
    <ソースSRC = "ビデオ/ test.ogg"タイプ= '映像/ OGG。 コーデック= "Theoraの、Vorbisの" '/>
    <ソースSRC = "ビデオ/ bubbles.m4v" />

    <オブジェクトの幅= "500"高さ= "300">
    ます。<param name = "映画"値= "preview.swf?ビデオ=ビデオ/ advideo.flv"> </ param>の
    ます。<param name = "allowFullScreen"値= "真"> </ param>の
    ます。<param name = "のallowScriptAccess"値= "常に"> </ param>の
    ます。<param name = "wmodeを"値= "不透明"> </ param>の
    <EMBED SRC = "preview.swf?ビデオ=ビデオ/ advideo.flv"タイプ= "アプリケーション/ X-衝撃波フラッシュ"幅= "500"高さ= "300"のallowScriptAccess = "常に" allowfullscreen = "true"とのwmode = 「不透明な」>
    </ EMBED>
    </オブジェクト>
    </ビデオ>
    </ DIV>

    </ div> <! -ENDビデオギャラリー - >





    一定の更新を受信し、インターネット上のFIY、このギャラリーは、ベストセラーの著者によって作成され、ほとんどの機能を備えたストック·ギャラリー(これまでに10、より多くの)
    スキンiPhoneアプリのコンパルスキン可能minutのFlashVarsをローカルvideos7をerabIedと萌え! envato AftESSサポートフォーラムFASTSI.FPORT

  • ダウンロードしてください
    このカテゴリー内の他のコンポーネントこの著者のすべてのコンポーネント
    コメントよくある質問と回答を求めた

    プロパティ

    :
    3 9月10日に作成、最終更新日

    ファイル:
    JavaScriptのJS、HTML、CSS、SWFが含ま/ FLV、ソフトウェアバージョン

    キーワード

    eコマース, すべてのアイテム, 説明, フラッシュ, フラッシュフォールバック, FlashVarsを, fullscren, ギャラリー, グラフィック, HTML5, すなわち, 画像, 情報, のlocalStorage, ビデオ, ボリューム, XML