0

I'm using "Swinxy Zoom" javascript library (jQuery based) to have a nice magnifying effect on an image.

So far so good, I achieve the expected feature by binding the zoom event to the relevant tag. See code below.

$(this).swinxyzoom({mode:'dock', zoom: 14 });

By default, this library triggers the zoom on hover. However, I'd like to trigger this on click instead, I manage to do this (see code below), but I can't find how to unbind the swinxyzoom plugin once the focus is out of the image.

$('a.swinxyzoom').click(function(e) {
    e.preventDefault();

    $(this).swinxyzoom({mode:'dock', zoom: 14 });

    /* here some code that unbinds the zoom on "mouse out" of image */
});

I suspect there might be a built-in feature already implemented, as my proposed solution is only a work around really. I double checked the Swinxy Zoom doc but could not find anything matching my requirement, maybe I missed something?

Adriano
  • 19,463
  • 19
  • 103
  • 140
  • What's the main reason for unbind the swinxyzoom? Is it because you wanna change the image? – MarvinK Mar 21 '14 at 08:46
  • the zoom feature should only be activated "on click", even after the first time you activate it. I'll provide a jsfiddle, as the current behavior is a bit awkward – Adriano Mar 21 '14 at 10:36

1 Answers1

1

Swinxyzoom is changing your DOM. I guess the only way to unbind this is to remove all the generated html from you dom.

MarvinK
  • 111
  • 2