Function for when an item becomes 'unstuck'

Question

This is probably simple, but so far have not been able to figure it out. I'm using Waypoints + Sticky for a header/logo area. I want the logo to have preventDefault() when it is stuck, so that clicks on it only do the toggleClass() action, but not follow the URL. But I need remove preventDefault() that when it is not stuck, so that clicking the logo will go to the website root URL as expected.

You can see it in progress here: http://radiantled.staging.wpengine.com

My script:

// Sticky Stuff
var header = $('#header');
var stuck_logo = $('.stuck #logo a');
var logo_shadow = $('.logo-shadow');
var header_height = header.outerHeight();
var header_offset = -(header_height+40);
var inner_header_height = inner_header.outerHeight();

header.waypoint('sticky',{
    offset: header_offset,
    handler: function() {
        stuck_logo.click(function(e){
            e.preventDefault();
            header.toggleClass('reveal');
            logo_shadow.toggleClass('hide');
        });
    }
});

Answer 1

what if you use:

$(document).on('click','.stuck #logo a', function(e){
   e.preventDefault();
   header.toggleClass('reveal');
   logo_shadow.toggleClass('hide');
});

and remove the function in handler