CODEWITHSUNDEEP
javascriptjquerycss
user3057167
user3057167

Reputation: 19

Inputbox focus set style to containing div : Background

I have this page div#container which contains inputboxes, textareas and selectboxes. When I click them i want to change the background color of the containing div "djform_field"

#dj-classifieds .dj-additem .djform_row .djform_field:focus {
    background: none repeat scroll 0 0 #F5F5F5;
    border-radius: 5px;
    float: left;
    padding: 15px;
}

<div class="djform_field">
        <textarea id="contact" name="contact" rows="1" cols="55" class="inputbox required"><?php echo $this->item->contact; ?></textarea>     
         <div id="input-tips"><span class="hint"><?php echo JTEXT::_('COM_DJCLASSIFIEDS_CONTACT_TOOLTIP')?><span class="hint-pointer">&nbsp;</span></span></div>             
    </div>
    <div style="clear:both"></div>
</div>

Upvotes: 0

Views: 118

Answers (3)

Frank Fang
Frank Fang

Reputation: 2162

$('#contact').focus(function(){
  $('.djform_field').addClass('red');
}).blur(function(){
 $('.djform_field').removeClass('red');
})

See demo here (using jQuery)

Upvotes: 1

Udit Bhardwaj
Udit Bhardwaj

Reputation: 1781

$('.djform_field').children('*').click(function () { //use required selector in .children(), * means all children
    $('.djform_field').css('background', 'color');
})

Upvotes: 0

tymeJV
tymeJV

Reputation: 104775

Set one big click handler:

$("#container :text, #container select").click(function() {
    $("div.djform_field)".css("background-color", "red"); //or whatever
});

Upvotes: 0

Related Questions