Permanent flip, how to unset .flip()

[marijnhurkens]

I am trying to create a situation where a div flips on hover and stays flipped after that. I am trying to achieve this because I have a video playing on the backside and I still want to use hover as the trigger.

I tried the following:

$('.showcase').flip({
    axis: 'x',
    trigger: 'hover'
 }).on('flip:done', function() {
    console.log('flipped');
    $(this).off('.flip');
});

While the console shows flipped on the flip finish after hovering it still flips back to it's original state and only then destroys the .flip() object.

How do I achieve the correct result?

[nnattawat]

I think the easiest is to use trigger: 'manual' and you will just flip it once

[marijnhurkens]

Well, off course.. Should have thought about that, solved :)

$('.showcase').flip({
    axis: 'x',
    trigger: 'manual'
});
$('.showcase .front').mouseover( function() {
    $(this).closest('.showcase').flip(true);
});

[jarodium]

A destroy method would be useful if we wanted to replace html contents via ajax and then flip them again.