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, ಕನ್ನಡ, Українська мова, ไทย
JavaScript / Images and Media

Responsive Slideshow Photo Gallery Grid

— アドオンWorldWideScripts.netへ

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

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


Responsive Slideshow Photo Gallery Grid - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

応答スライドショーフォトギャラリー 、流体 /フレキシブル/応答のレイアウトになっています。 基本的には、グリッドは、グリッドの高さは、サムネイルの数に基づいて変更され、他の要素は、グリッドのdivの下にある場合、彼らは自動的にプッシュダウンされ、そのdi​​v要素の幅の基づいて択一のDIVの中にHTMLページに追加され、それが適応です(ドキュメントフロー)。 提供された例では、あなたが他の構成が可能であるもちろん、このグリッドを使用する可能性のあるいくつかの方法を見ることができます(この例のコードは、ダウンロードファイルで提供されていることに注意してください)​​。

JavaScriptコードは純粋なオブジェクト指向プログラミング、jQueryのまたは他のライブラリの使用法はありません、このようにjQueryのまたは他のJavaScriptライブラリを使用している可能性があり、HTMLページとの非互換性はありません。

応答スライドショーフォトギャラリーは、HTML5 の標準を使用して 、GPU(ハードウェアアクセラレーション)を使用しています。 レンダリング速度と性能は、モバイルデバイス上のデスクトップコンピュータと、最も重要なのは、それはそれはCSS3を使用しようと、これは使用できない場合、それはIE7IE8のような古いブラウザ用CSS2やCSS1に秋ダウン意志動作方法で非の打ちどころのないです。

モバイルデバイス上で素晴らしいパフォーマンス、あなたは!それは符号化され、モバイルデバイス向けに最適化された、それだけで、ネイティブアプリのよう実行されるビデオデモで見ることができますし、それはデスクトップコンピュータで100%、モバイル互換性があり、もちろん、それが実行され、同じように素晴らしいですIE7IE8のような古いブラウザに含みます。 我々はIPAD3(IOS)にし、サムスンギャラクシーS3( アンドロイド )でそれをテストして、それを以下に、両方のデバイスに大きな実行されます。このデモを表示するためのリンクです。
デモは、サムスンギャラクシーS3(アンドロイド)で実行されている時計IPAD(IOS)上で実行されているデモ。

GRID主な特長

柔軟/流体レイアウト:あなたはCSSやJavaScriptでグリッドのサイズを制御することができ、基本的にそれは、プロジェクトの任意のタイプのための完全な候補となっている適応性のレイアウトになっています。

全体の色のテーマを変更することができます。

カスタマイズ可能なサムネイル ​​のサイズと形状:この機能を使用すると、サムネイル ​​のサイズとサムネイル ​​の間のスペースを変更することができます。

カスタマイズ可能なサムネイル ​​境界線と背景:各サムネイル ​​は、サムネイル ​​の背景色、枠線のサイズと境界線の色はカスタマイズ可能で、境界線と背景を持つことができます。

サムネイル ​​の説明:各サムは、その下に透明な背景を持つ短い説明を持つことができ、この説明は、マウスがサムネイル ​​の上にあるときに、テキストはCSSでフォーマットすることができます表示され、背景色と不透明度も(オプション)変更することができます。

ロードよりサムネイル ​​機能 」:これは、このようにしていないすべてのサムネイル ​​がロードされており、一度に表示するので負荷の全体的なパフォーマンスとスピードを向上させる素晴らしい機能です。 あなたは120サムネイルの合計を持っている場合たとえば、あなたは50サムネイルのセットでそれらを表示することができ、そのため当初は、グリッドで50サムネイルの最初のセットがロードされ、表示されている、とすると、「ロードより多くのサムネイルは「ボタンが次を押されました50サムネイルのセットがロードされ、表示され、「ロードよりサムネイル」ボタンをもう一度押すと、最終的に20の残りのサムネイルが示されているされています。 セットごとにロードするサムネイルの数はカスタマイズ可能です、それはあなたが考慮任意の番号にすることができ50である必要はありません。 それはすべてのサムネイルが読み込まれて表示され無効になっている場合、この機能は、オプションです。

カスタムプレスサムネイル ​​アクション:サムネイル ​​が押されたときにどちらかを選択することができ、このウェブページのURLとターゲットを指定することができ、我々はコード化されている元のメディアをライトボックスを表示するか、新しいWebページを開きます。 ライトボックスは、 画像を表示することができ、またはYouTubeやVimeoのからロードされたビデオを表示することができます。

ライトボックス主な特長

柔軟/流体レイアウト:lighboxは、常に利用可能なブラウザのビューポートを記入します。

全体の色のテーマを変更することができます。

VimeoのやYouTubeのサポート:あなたがしなければならないすべては、あなたが表示するとlighboxはあなたのビデオを表示し、再生されますしたいYouTubeやVimeoのビデオからのリンクを含めることです。 各ビデオのサイズ(幅と高さ)を容易に設定することができます。

ズームと画像のサポートパン:あなたがイメージにズームイン、ズームアウトすることができますし、このようにあなたは非常に詳細(オプション)で画像を見ることができ、画像をパンすることができます。

スライドショーボタン (オプション)。

スライドショー遅延は、スライドショーの遅延時間は秒単位で設定することができます。

スライドショー自動再生。

カスタムアニメーショングラフィックスをスライドショー。

次と前のボタンナビゲーション(オプション)。

情報ボタンと情報ウィンドウ:各lighbox項目が記述を持つことができ、テキスト、ウィンドウの外観は、CSS(オプション)でフォーマットすることができます。

カスタマイズ可能な境界線と背景:境界線のサイズや色、またメインの背景色はカスタマイズ可能です。

キーボードのサポート:左と右の矢印は、ナビゲーション(オプション)に使用することができます。

アップデート

2013年2月19日 - サムネイルが選択されているときに我々はこのグリッドに新しい機能を追加した、彼らが選択された場合、サムネイルの上に、メディアのアイコンを追加するオプションは、今、あなたはサムネイルの説明、メディアアイコンまたは「なし」の間で選択できます。

2013年7月3日 - ライトボックスに関連するいくつかのバグを修正し、移動検出のためのより良いサポートを追加しました。


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

プロパティ

作成:
1月15日13

最後の更新:
3月8日13

高解像度:
はい

推奨ブラウザ:
IE7、IE8、IE9、IE10、IE11は、Firefox、Safariの、オペラ、クローム

含まれるファイル:
JavaScriptのJS、HTML、CSS

キーワード

eコマース, eコマース, 全商品, CSS3, 動的, フレキシブル, 流体, グリッド, HTML5, ライトボックス, メディア, 反応します, Vimeoの, 動画