tekknow tekknow - 22 days ago 16
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:


https://jsfiddle.net/tekknow/8qj99bkt/1/

The div is shown initially when it should be hidden.

Answer

Try this:

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

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

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

   });
});

https://jsfiddle.net/8qj99bkt/5/

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.

Comments