Skip to content Skip to sidebar Skip to footer

Thinning Down A Jquery Focus Script?

I have a really simple jQuery script which when an input element is focused on, it expands its width to 250px (using the focusin() event), and when the focus is lost, it shrinks ba

Solution 1:

I see nothing wrong with what you've done. If you feel you're repeating yourself too much, you might pull out some logic into a animateWidth function:

$(document).ready(function() {

    function animateWidth(element, width) {
        element.animate({ width: width }, 500);
    }

    $('input').focus(function () { animateWidth($(this), '250px'); })
              .focusout(function () { animateWidth($(this), '200px'); });

});

Post a Comment for "Thinning Down A Jquery Focus Script?"