2017-05-09 16 views
-3

誰もがFlickrのスタイルを行う方法を知っています:jQueryの経由jQueryのライトボックスのズーム効果

https://www.flickr.com/photos/bmse/34377828322/in/explore-2017-05-08/

フォトズーム効果+ライトボックスを?

画像をクリックすると画像が拡大され、ページ全体がカバーされ、マウスコントロール画像の動きが可能になります。 モバイルで - 少しズームすると画像が高品質の画像に変わります。

おかげ

+1

からコードをダウンロードすることができます:それはおそらく、既製のスクリプトではありません。同じような振る舞いが必要な場合は、バックグラウンドシャドーカバー、ズームアニメーション、マウストラッキング、適切なタイミングでのズームアウト、モバイルサポートなど、作品から自分で構築する必要があります。あなた自身でビルドしたくない場合は、オープンソースのライトボックススクリプトをいくつか見つけて、「十分に近い」動作が受け入れられるようにすることをお勧めします。 –

+0

あなたの助けに感謝します。 web.whatsapp.comで同様の効果が見られました。画像をクリックしたり、ズームしたり、マウスを動かすと完全にコード化された画像が移動します。 あなたは正しいです私はそれを私の自己とすべてを共有するために構築しようとします:) –

+1

あなた自身を作成することができます、ちょうどすべてのトリックが移動計算にあります これを参照してください[フィドル](https://jsfiddle.net/ bRIMOs/331177ns/1 /) –

答えて

1

ズームエフェクトを使用するには、jquery PANプラグインを追加する必要があります。ズームexample hereと別のexample hereを見ることができます。

必要に応じて2つのプラグインをマージする必要があります。両方のプラグインが機能するように、PANプラグインがギャラリープラグインの大きなイメージに必要なクラスを適用してください。

あなたは、これはFlickrの時、人々が書いた可能性が非常に高いカスタムのJavaScriptでhere

+0

ありがとう、これは非常に近いです。 –

0

あなたはthose jQuery pluginのいずれかを使用して、それはあまりにもあなたが必要と調整することができます。
これが役に立ちます。
SYA :)

関連する問題