スワイプ機能付きレスポンシブフォトウォールギャラリー

Question

以下の基準を満たすjavascript/jqueryギャラリーをビルドしようとしていますが、これらの機能のすべてまたはほとんどを備えた既存のギャラリーモジュールがあるかどうかを知りたいです。

ズーム（シングルビュー）機能付き壁写真。例えば。 http://tympanus.net/Tutorials/SlidingPanelPhotowallGallery/

2.応答して、デスクトップ&モバイルデバイス用の適切写真の壁の画像がタイルように、ユーザーがブラウザのサイズを変更した場合に改造。例えば。 http://isotope.metafizzy.co/

（任意であるが望ましい）。ユーザーがモバイルデバイス上にいる場合は、シングルビュー画像をスワイプできます。

一言で言えば、ユーザーは、サムネイルの壁に移動して画像を選択し、さらに拡大した写真をスワイプしたり、壁に戻ったりすることができます。

写真はサーバー上のフォルダから取得されます。モデレーターは単なるカメラガールで、デジタルカメラの画像をftp経由でこのフォルダーにアップロードします。画像のサイズを変更したり最適化したりすることはありません。

私たちはPHP/Linux環境でホストしています。私の知る限り、あなたがプラグインを作成するか、すべてのカスタマイズされた機能を取得するためのjQueryの機能を所有して記述する必要が知っているよう

Answer 1

は、jQueryのメイソンを見てください：http://masonry.desandro.com/

これは、応答性の壁として使用することができます。

あなたが求めているものが「ズーム」（これは別の効果です）と呼ばれていないものは、ライトボックスと呼ばれるものです。ここには多くのものがあります、比較は、http://planetozh.com/projects/lightbox-clones/

イメージを再サイズするには、画像GDまたはimagemagickを使用するためにPHPを書く必要があります。ここではチュートリアルhttp://net.tutsplus.com/tutorials/php/image-resizing-made-easy-with-php/またはおそらくスクリプトですが、 http://shiftingpixel.com/2008/03/03/smart-image-resizer/（またはtimthumb.php）。

あなたのJavaScriptを使っていくつかのPHPを書く必要があります。

あなたが求めているものはすべて一つの解決策ではありません。それを書くか、誰かを雇う必要があります。

Answer 2

。（それは、パフォーマンスとメンテナンスの意味で非常に良いだろう）

1. 機能をズームため、あなたはモーダルウィンドウのいくつかをajax呼び出しで使用するか、作成することができます。
2. これを達成するには、良いCSSを書く必要があります。そうすれば、良いCSSを書くとscreen.reshuffleに従って整列した写真が処理されます。
3. はい、これはブラウザのナビゲータを検出し、それに応じてCSSとJavaScriptを変更することで実現できます。
4. 画像処理（画像のサイズ変更、サムネイルの動的生成）の場合、PHPバックエンドソリューションを選択できます。
5. そして、Ajax経由でフォルダから画像を処理し、必要に応じてそれらを表示することができます。