The three-state image button is essential for a good user experience. I processed dom events and implemented three-state buttons without changing the html. The key to the solution below is to remove the dotted line selection box and locate the background without loop processing. If any button defines the background image and border as 0, it is automatically changed to a three-state button.
<Body> <button style = "width: 53; height: 17; border: 0; background: url (http://www.jb51.net/upload/button_a.png)"> </button> </body>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
The above solution also has some shortcomings, that is, in firefox, you cannot use the Tab key to locate the button. This is because the click event is blocked to remove the dotted box. The following program solves this problem by creating an invisible button in the button, which transfers the focus.
<Style> button {border: 0 }</style> <body> <button style = "width: 53; height: 17; background: url (http://www.jb51.net/upload/button_a.png) "> </button> </body>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]