I know this is sloppy code, I'm more of a HTML and CSS person than JavaScript person. The thing is this code does exactly what I need it to do. This is done with mootools and it conflicts with some other jQuery things going on, on the page. I would REALLY appreciate any help anyone could give me.
This isn't the finished code implemented but if there core details of this code could be re-written as jQuery I can probably tailor it for the purpose I'm using it for. window.addEvent('domready', function() { $('myInput').addEvent('keyup', function() { max_chars = 20; current_value = $('myInput').value; current_length = current_value.length; remaining_chars = max_chars-current_length; $('counter_number').innerHTML = remaining_chars; if(remaining_chars<=14){ $('europe').setStyle('opacity', '3.5'); } else if(remaining_chars<=15){ $('europe').setStyle('opacity', '3'); } else if(remaining_chars<=16){ $('europe').setStyle('opacity', '0.25'); } else if(remaining_chars<=17){ $('europe').setStyle('opacity', '0.2'); } else if(remaining_chars<=18){ $('europe').setStyle('opacity', '0.15'); } else if(remaining_chars<=19){ $('europe').setStyle('opacity', '0.1'); } else { $('europe').setStyle('opacity', '0.05'); } }); });