treehouse : what would you like to learn today?
Web Design Web Development iOS Development

fadeToggle jquery

  • Hello!
    I'm trying to replicate the html5rocks "Search".
    Here is my attempt: jsfiddle

    My question is what is the best practice to achieve this, how can I hide by default the searchbox div and how to append a "close" button with the same fading effect?
    Thanks!



  • $("#searchbox").hide(); // Hide by default
    $("button").click(function() {
    $("#searchbox").fadeToggle("slow", "linear").find(".close").on("click", function() {
    $(this).parents("#searchbox").fadeOut("slow");
    return false;
    });
    });

    http://jsfiddle.net/tovic/KaeT7/1/