Question

See here:
http://jsfiddle.net/kbkPL/

Right now on mouseenter and mouseleave the hidden slide panel slides in and out.

If the user has focus on that input box I want to keep the panel open (and prevent it from sliding back out) until focus is lost or the user has pressed submit. How would I accomplish this? Thanks.

Answer 1

This is a possibility:

$(document).ready(function(){
$("#promoContentTrigger").mouseenter(function(){
    $("#promoContentPanel").toggle("fast");
    $(this).toggleClass("hideTrigger");
});
$("#promoContentPanel").mouseleave(function(){
    if ($(".textBox").is(":focus")) {return;}
    $("#promoContentPanel").toggle("fast");
    $("#promoContentTrigger").removeClass("hideTrigger");
});

});​