2017-05-09 2 views
-3

Est-ce que quelqu'un sait comment faire le style Flickr:jQuery light box effets de zoom

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

effets zoom photo + lightbox via jQuery?

Si vous cliquez sur l'image, l'image agrandie et couvrant toute la page et permettant un mouvement d'image de contrôle de la souris ... Sur mobile - un petit zoom changer l'image en image de haute qualité.

Merci

+1

Ceci est JavaScript personnalisé très probable que les gens de Flickr écrit: Il est probablement pas un script impromptu. Donc, si vous voulez le même comportement, vous devrez le construire vous-même à partir de ses pièces: une couverture d'ombre de fond, une animation de zoom, un suivi de la souris, un zoom arrière au bon moment et un support mobile. Je recommande que si vous ne voulez pas le construire vous-même, vous trouvez un autre script de lightbox qui est un code open-source et qui a un comportement "assez proche" pour être acceptable. –

+0

Merci pour votre aide. J'ai vu un effet similaire dans web.whatsapp.com, en cliquant sur l'image, zoomé, et déplacer la souris déplacer l'image, parfaitement codé. Vous avez raison, je vais essayer de le construire moi-même et partager avec tous :) –

+1

vous pouvez créer votre propre, juste tout le tour est dans le calcul de mouvement, voir ce [violon] (https://jsfiddle.net/ bRIMOs/331177ns/1 /) –

Répondre

1

Vous devez ajouter le plugin jquery PAN pour avoir des effets de zoom. Vous pouvez voir zoom example here et un autre example here.

Vous devez fusionner deux plugins pour répondre à vos besoins. Appliquez la classe dont le plugin PAN a besoin à votre grande image du plugin de galerie pour que les deux plugins fonctionnent.

Vous pouvez télécharger le code de here

+0

Merci beaucoup, c'est très proche de. –