tekknow tekknow - 1 year ago 86
jQuery Question

jquery div won't show/hide slide

I'm trying to show a div and slide in from the right when textbox gets focus and hide the div and slide out when the textbox loses focus. I had it working before and then it stopped working.

Please have a look at this jsfiddle:


The div is shown initially when it should be hidden.

Answer Source

Try this:

    $('#pwd').focus(function() {
        $('#rules').show('slide', {direction: 'right'}, 500);

    $('#pwd').blur(function() {

        $('#rules').hide('slide', {direction: 'right'}, 500);



The following changes were made:

  • Replaced focusout event with blur (optional).
  • Added JQueryUI reference.
  • Re-added JQUERY reference.

You are just missing JQuery-ui reference.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download