Question

I have spent hours trying to figure this problem and i just can’t, so if you think you got what it takes please give me a hand.

I am writing jQuery code to add a delete button (iphone style) in a web app. However I can’t get it to hide the currently swiped delete when you swipe it for the second time (with intent to hide it). When you slide elsewhere it does hide the previous one.

Here is a jsfiddle example of the code by using click instead of swipe. You will notice if you click twice on the li it won’t hide the delete. But if you click eslewhere it does.

the real code is

$("li.swipeDelete").live("swipe",function(){
        var $th_btn = $(this).find(".aDeleteBtn");
        $(".aDeleteBtn").removeClass("fadeInLeft");
        $th_btn.toggleClass("fadeInLeft");
    });

Thanks 🙂

Answer 1

I’m sorry to kill the party but right after i added it it came to me. Moving the removeClass after, and only removing the class if it already has class slideLeft and its NOT the current element.

var $th_btn = $(this).find(".aDeleteBtn");
$th_btn.toggleClass("fadeInLeft");
$(".aDeleteBtn.fadeInLeft").not($th_btn).removeClass("fadeInLeft");

I hope this can be used as a reference. I will also make a jquery plugin so everyone can enjoy this great feature.