Replace images in PhotoSwipe gallery

问题

I have a PhotoSwipe gallery on my page which is created programatically like this:

var instance = window.Code.PhotoSwipe.attach(image, options)

Now I want to update the images in the gallery, or put a new gallery in the same spot.

Creating a new gallery for the same DOM Element omits the following error:

Code.PhotoSwipe.activateInstance:
Unable to active instance as another instance is already active for this target

Detaching the instance from the Element using Code.PhotoSwipe.detatch(instance) didn't help either.

Any ideas how to fill the gallery with new images, or remove it, so I can create a new one in the same place?

回答1:

The only way I found to avoid that error was calling unsetActivateInstance before detatch:

window.Code.PhotoSwipe.unsetActivateInstance(instance);

window.Code.PhotoSwipe.detatch(instance);

回答2:

you can also hide the current active instance, instead of detatching it by calling

window.Code.PhotoSwipe.activeInstances[0].instance.hide(0)

回答3:

I tried all the suggestions above but none of them worked well.

So my solution was to simply never create the gallery for the same ID twice:

    instance = window.Code.PhotoSwipe.getInstance(myuniqueid);
    if (window.Code.Util.isNothing(instance)) {
        // Only initialize if there is no gallery with this ID already.
        myPhotoSwipe = window.Code.PhotoSwipe.attach(window.document.querySelectorAll(galleryimagesselector), {captionAndToolbarAutoHideDelay: 0, jQueryMobile: true, preventSlideshow: true, enableMouseWheel: false, enableKeyboard: false}, myuniqueid);
    }

来源：https://stackoverflow.com/questions/9330838/replace-images-in-photoswipe-gallery

标签

javascript

photoswipe