CODEWITHSUNDEEP
jquery
chuckscoggins
chuckscoggins

Reputation: 33

Hide Element When Form Field Focus

I am working on a web app for display on iPhone and when the form field becomes active, the nav (.nav-btns) at the bottom of my page gets in the way. I'd like to hide that element when any form element becomes in focus. Here's what I've currently tried with jquery, but no luck:

<script type="text/javascript">
$( document ).ready(function() {
$("select").is(":focus").hide(".nav-btns");
});
</script>

Upvotes: 0

Views: 1814

Answers (1)

shennan
shennan

Reputation: 11656

How about:

$(function(){

  $('select').focus(function(){

    $(".nav-btns").hide();

  });
});

This should bind the focus event to all of your select elements, and then hide the element with the class .nav-btns.

For undoing the change on an 'unfocus':

$(function(){

  $('select').focus(function(){

    $(".nav-btns").hide();

  }).blur(function(){

    $(".nav-btns").show();

  });
});

Upvotes: 5

Related Questions