1

It seems one of my toggle() functions have depreciated, I am just wondering what a suitable replacement would be. I have searched but can't seem to find a clear answer, can anyone help?

Here is my code

$( ".open-btn" ).toggle(function() {
    $(".foldable").css( "height", "517px" );
    $(".open-btn a").text( "CLOSE MENU" );
    $(".reserve-btn").fadeIn();
}, function() {
    $(".foldable").css( "height", "0px" );
    $(".open-btn a").text( "SHOW MENU" );
    $(".reserve-btn").fadeOut();
});
informatik01
  • 16,038
  • 10
  • 74
  • 104
user2820604
  • 281
  • 1
  • 6
  • 15
  • You could simply apply a `click` handler to the element, and set the value of a `data-*` attribute to determine which one of the toggles to fire. – Nunners Mar 10 '14 at 16:46
  • If you google _jquery toggle deprecated_, the first hit is the jQuery Forum thread: https://forum.jquery.com/topic/beginner-function-toggle-deprecated-what-to-use-instead – Barmar Mar 10 '14 at 16:55

2 Answers2

0

Try this:

function assignToggleHandler() {
    $(".open-btn a").click(function() {
        if($(".open-btn a").text() == "SHOW MENU") {
            $(".foldable").css( "height", "517px" );
            $(".reserve-btn").fadeIn();
            $(".open-btn a").text( "CLOSE MENU" );
        } else {
            $(".foldable").css( "height", "0px" );
            $(".open-btn a").text( "SHOW MENU" );
            $(".reserve-btn").fadeOut();
    }
}

Then just call the function:

assignToggleHandler();

PM me if you want an example of one I built in a page I'm building right now.

griff4594
  • 484
  • 3
  • 15
  • Why have you made a function that assigns an event handler? It would make more sense to move the code outside the function and just dump the function completely. That way it doesn't have to be called. – Reinstate Monica Cellio Mar 10 '14 at 16:56
  • in case it has to be called throughout a script. All he has to do it call the function. If he is using several scripts, it can be called anytime he needs to on any page in any script. It is just an option for him. I'm not telling him he has to do it that way. – griff4594 Mar 10 '14 at 17:01
  • Thanks for explaining it for him, as that's not a normal way of doing things. Maybe a more suitable function name would be better, like `assignToggleHandler` or something :) – Reinstate Monica Cellio Mar 10 '14 at 17:10
  • 1
    agreed....edited my post – griff4594 Mar 10 '14 at 17:14
0

Try to use:

$( ".open-btn" ).click(function() {
    $(".foldable").css('height') === '0 ? $(".foldable").css('height','517px') : $(".foldable").css('height', 0);
    $(".open-btn a").text(($('.open-btn a').text() == 'SHOW MENU') ? 'CLOSE MENU' : 'SHOW MENU');
    $(".reserve-btn").fadeToggle();
});
Felix
  • 37,892
  • 8
  • 43
  • 55