I ran a test case with this because i was doing this the long way. Come to find out, if you happen to already know the labels for="" and input’s id, then a switch case is quicker.
$('form :input').bind({
focus: function () {
var id = $(this).attr('id').toString();
var add = $("label[for='" + this.id + "']").addClass('labelfocus');
switch (id) {
case 'title':add;break;
case 'description':add;break;
case 'resource':add;break;
case 'tag':add;break;
case 'theme':add;break;
case 'language':add;break;
}
},
blur: function () {
$('label').removeClass('labelfocus');
}
});
jsPerf Benchmark Test Case (Slightly modified with triggering events). I do however prefer this method due to the less code and easy to use, especially if you have dynamic forms.
All comments are held for moderation. We'll publish all comments that are on topic, not rude, and adhere to our Code of Conduct. You'll even get little stars if you do an extra good job.
You may write comments in Markdown. This is the best way to post any code, inline like `<div>this</div>` or multiline blocks within triple backtick fences (```) with double new lines before and after.
Want to tell us something privately, like pointing out a typo or stuff like that? Contact Us.
We have a Code of Conduct.
Be cool. Be helpful. The web is a big place. Have fun. High five.
pleasee give me this example :(
This will come in handy, will use a subtle rgba colour background on selection – cheers :-)
I ran a test case with this because i was doing this the long way. Come to find out, if you happen to already know the labels
for=""and input’s id, then a switch case is quicker.jsPerf Benchmark Test Case (Slightly modified with triggering events). I do however prefer this method due to the less code and easy to use, especially if you have dynamic forms.
You can style it with just CSS if you put the label after the input
Here is very good example It realised like small jQuery plugin and can be customized as you wish.