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. 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 ...... 
  2. 03/21/2018Domino Apps on IOS is a Game Changer. Quit holding back.BOOM. This will be as important for the platform as Traveler. If your company has ditched Notes and Domino, I feel sorry for you. For companies that do use Notes/Domino this is a game changer and Apple should be paying attention. Here's why: There are hundreds of little Notes client applications you'd never spend the time and money to build and deploy for your internal user base on IOS that we use Notes for all the time (those of us still using it). Now, those are suddenly ALL available on the iPad. ...... 
  3. 02/15/2018Andrew’s Proposed Gun LawsThese are my current thoughts on gun laws that would radically change the culture and safety of gun ownership in the United States without removing the rights of gun owners or compromising their privacy rights. * Please feel free to link to, or just copy, these ideas. It would be wonderful to see them spread widely and eventually become the basis for something to rally around and become legislation. Update: 3/3/2018 I added #7, increasing the age to purchase. Update: 4/27/2018 Please be aware that I am not ...... 
  4. 05/05/2016Is the growing social-sourced economy the modern back door into socialism? 
  5. 04/20/2016Want to be whitelisted? Here are some sensible rules for web site advertising 
  6. 12/30/2015Fantastic new series on Syfy called “The Expanse” – for people who love traditional science fiction 
  7. 10/20/2015My suggestion is to stay away from PayAnywhere(dot)com  
  8. 08/07/2015Here is one for you VMWARE gurus - particularly if you run ESXi without fancy drive arrays 
  9. 08/06/2015The Killer of Orphans (Orphan Documents) 
  10. 06/02/2015Homeopathic Marketing: Traveler on my Android is now calling itself VERSE. Allow me to translate that for the IBM Notes community... 
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.