Question

var widgetOverlay = jQuery('#widgetOverlay');
var widgetOpen = jQuery('#widgetOpen a');   
var widgetOverlayHeight = widgetOverlay.height() - 3;
widgetOverlay.css({
    marginBottom : -widgetOverlayHeight,
    display : 'block'
}); 
widgetOpen.toggle( function() {     
    widgetOverlay.animate({
        marginBottom : 0
    }, 600);        
    widgetOpen.addClass('hide');
}, function() {     
    widgetOverlay.animate({
        marginBottom : -widgetOverlayHeight
    }, 400);        
    widgetOpen.removeClass('hide');     
});

I want to replace “toggle” with “click”, and I don’t know how. I tried just to replace it, and it’s working just the first function. Help !

Answer 1

var widgetClicked = false

widgetOpen.on('click',function(){     
    if(widgetClicked==false){
       widgetOverlay.animate({
           marginBottom : 0
       }, 600);        
       widgetOpen.addClass('hide');

       widgetClicked = true;
    }


    else{
       widgetOverlay.animate({
           marginBottom : -widgetOverlayHeight
       }, 400);        
       widgetOpen.removeClass('hide');  

       widgetClicked = false;
    } 
});

Do something like this.