javascript - how to change stylesheets using 'onmouseover' and 'onclick' events? -


i want change style sheets permanently when function 'onclick' event called.. , 'onmouseover' event change style sheet long cursor stays on button..

in code, functions first 2 events work fine..but 'onclick' event's function doesn't work @ all.. can tell i'm doing wrong? n how can make work?

here's code:

<html> <head> <link id="theme" rel="stylesheet" type="text/css" href="css//main.css" >  <script>   function m1()   {   document.getelementbyid("theme").href= "style1.css";  }  function o1(){ document.getelementbyid("theme").href= "css//main.css";             }  function c1()   {  document.getelementbyid("theme").href="style1.css"; }         </script>   </head> <body>   <div id="menu">                 <ul id="br">                     <li> select theme                         <ul id="dp">                             <li><button id="b1" onmouseover="m1()" onmouseout="o1()" onclick="c1()" >style 1</button></li>                             <li><button id="b2">style 2</button></li>                             <li><button id="b3">style 3</button></li>                         </ul>                     </li>                 </ul>       </div>     

m1() , c1() load same stylesheet. when mouseover button , click, 2 events fired. i'm not sure order of fired events; however, should put console.log in each function see called.

function c1(){     document.getelementbyid("theme").href="style1.css";     console.log("on click");     } 

Comments

Popular posts from this blog

php - failed to open stream: HTTP request failed! HTTP/1.0 400 Bad Request -

java - How to filter a backspace keyboard input -

java - Show Soft Keyboard when EditText Appears -