Andrew Pollack's Blog

Technology, Family, Entertainment, Politics, and Random Noise

Code Tidbit -- JavaScript to make all your button and text input elements easily CSS accessible.

By Andrew Pollack on 01/05/2007 at 10:02 PM EST

Ever want to do something in CSS that impacts only the buttons on your page? I came across a nifty bit of JavaScript that solves the problem of CSS applied to buttons rather than all input tags. A button is an input tag, and there is no CSS (current supported versions) selector for buttons specifically.

This code, called in the onload() event of the document, will add a class name of "button" to all the button elements on the form, and a class name of "text" to all the text input device.

Dustin Diaz had posted the original code, to which I've added a bit of functionality. Dustin's original simply put the class tag in. My version (which I've posted here and to Dustin's blog) will add the class tag (css allows multiple class tags with space separation) if one already exists.

function changeInputs() {
 var els = document.getElementsByTagName('input');
  for (var i=0; i <  els.length ;i++ ){
   if ( els[i].getAttribute('type') ) {
    if ( els[i].getAttribute('type') == "text" ) {
     if(els[1].className ) { els[i].className = els[i].className +  ' text '; } else { els[i].className = ' text '; 
   } else {
     if(els[1].className ) {els[i].className = els[i].className +  ' button ' ; } else { els[i].className = ' button '; }
} } } }

There are  - loading -  comments....

Other Recent Stories...

  1. 10/08/2018Will you be at the NYC Launch Event for HCL Domino v10 -- Find me!Come find me in NYC on Wednesday at the Launch Event if you're there. I really do want to talk to ...... 
  2. 09/04/2018With two big projects on hold, I suddenly find myself very available for new short and long term projects. In twenty five years, I don't think I've ever written an entry like this, but if you need the kind of work I do now would be a great time to get in touch. Both of the big projects I had lined up for late summer and early fall have been placed on hold and will be that way for a while. With the kids now all off at college and careers, I'm open to more travel than such than I have been in decades, but unless something else comes along, I'll be here working on updates to Second Signal and other things that ...... 
  3. 07/13/2018Who is HCL and why is it a good thing that they are now the ones behind Notes and Domino?We need to address some biases here. IBM has made a deal under which the Notes & Domino software and intellectual property is now being developed and maintained by HCL America. HCL America is part of the very large "HCL Technologies" company that has grown from its roots in India to become an 8 Billion Dollar company with a global presence in the IT Industry. You could be excused for initially believing, as many people do when they hear this, that "they've outsourced the code to India where they'll milk it ...... 
  4. 03/21/2018Domino Apps on IOS is a Game Changer. Quit holding back. 
  5. 02/15/2018Andrew’s Proposed Gun Laws 
  6. 05/05/2016Is the growing social-sourced economy the modern back door into socialism? 
  7. 04/20/2016Want to be whitelisted? Here are some sensible rules for web site advertising 
  8. 12/30/2015Fantastic new series on Syfy called “The Expanse” – for people who love traditional science fiction 
  9. 10/20/2015My suggestion is to stay away from PayAnywhere(dot)com  
  10. 08/07/2015Here is one for you VMWARE gurus - particularly if you run ESXi without fancy drive arrays 
Click here for more articles.....

pen icon Comment Entry
Your Name
*Your Email
* Your email address is required, but not displayed.
Your thoughts....
Remember Me  

Please wait while your document is saved.