1

I want an element to toggle on doubleclick event but it is not working. 

function doubleClick(e,fteven,position,oppname,mftname) {

var opponentstand = 'png.png';
var opponentrun = 'gif.gif';
var ftplayerstand = 'png.png';
var ftplayerrun = 'gif.gif';
var oppodd = fteven - 1;

jQuery('#div_label_ft').toggle(
    function(){
        var distance = jQuery('#div_label_opp').offset().left - jQuery('#div_label_ft').offset().left;

        jQuery('#div_img_opp').removeAttr('src',opponentstand).attr('src',opponentrun);
        jQuery('#div_img_ft').removeAttr('src',ftplayerstand).attr('src',ftplayerrun);

        jQuery('#div_label_ft').animate({
        'left': '+='+distance,
        }, 1500,function(){
            jQuery('input[type=radio]#div_ft').attr('checked',false);
            jQuery('#div_img_ft').removeAttr('src',ftplayerrun).attr('src',ftplayerstand).css('transform','rotateY(180deg)');
        });

        jQuery('#div_label_opp').animate({
        'right': '+='+distance,
        }, 1500,function(){
            jQuery('input[type=radio]#div_opp').attr('checked',true);
            jQuery('#div_img_opp').removeAttr('src',opponentrun).attr('src',opponentstand).css('transform','rotateY(360deg)');

        });
    },
    function(){
        var distance = jQuery('#div_label_opp').offset().left - jQuery('#div_label_ft').offset().left;

        jQuery('#div_img_opp').removeAttr('src',opponentstand).attr('src',opponentrun);
        jQuery('#div_img_ft').removeAttr('src',ftplayerstand).attr('src',ftplayerrun);


        jQuery('#div_label_ft').animate({
        'left': '+='+distance,
        }, 1500,function(){
            jQuery('input[type=radio]#div_ft').attr('checked',false);
            jQuery('#div_img_ft').removeAttr('src',ftplayerrun).attr('src',ftplayerstand).css('transform','rotateY(360deg)');
        });

        jQuery('#div_label_opp').animate({
        'right': '+='+distance,
        }, 1500,function(){
            jQuery('input[type=radio]#div_opp').attr('checked',true);
            jQuery('#div_img_opp').removeAttr('src',opponentrun).attr('src',opponentstand).css('transform','rotateY(180deg)');

        });//
});

}

This is my function which i am using.

It is working on second double click perfectly fine. But not on first double click event.

Kindly, guide!

Joomler
  • 2,610
  • 3
  • 30
  • 37
  • Are you using an old version of jQuery? The [`.toggle()` event handling method](http://api.jquery.com/toggle-event/) was *removed* in version 1.9, but in any case it assigned handlers for single click events, not double-click events. If your `doubleClick()` function is your double-click handler then it doesn't make sense to call `.toggle()` at all, because (even if using an older version of jQuery) that would just bind more and more handlers to your element. – nnnnnn Jul 21 '15 at 11:26
  • Thank you for your response. I am using older version of jQuery. but i want to use jQuery doubleclick event for reverse animation therefore i was using toggle. Is there any other option for this to attain the reverse animation? – Joomler Jul 21 '15 at 11:53
  • you might wanna look at this question http://stackoverflow.com/questions/16520218/jquery-reverse-animation-on-click – Rachel Gallen Jul 31 '15 at 22:07

1 Answers1

0

The documentation says that the .toggle() function is deprecated (http://api.jquery.com/toggle-event)

I have used .animate() and it worked for me.

Joomler
  • 2,610
  • 3
  • 30
  • 37