Using Javascript to Alternate background color of HTML element -
so have practise test asks me change background color , text color of paragraph section id "fourth" black background , white text vise versa , reverse every 30 seconds preferably using if/else statements. reason if statement (and else statement) not work.
the code have far this:
html
<html> <head> <link href="teststyle.css" rel="stylesheet" type="text/css"/> <script src="flash.js" type="text/javascript"></script> </head> <body> <div id="first"> mares eat oats </div> <h1 id="second"> , eat oats </h1> <p id="third"> , little lambs eat ivy </p> <p id="fourth"> mirthipan karunakaran </p> </body> </html>
css
#first { text-align: center; } #second { color: green; text-align: left; } #third { color: orange; text-align: right; } #fourth { color: white; background-color: black; }
javascript
function updatepage(){ var name = document.getelementbyid("fourth"); if(name.style.backgroundcolor == "black") { name.style.backgroundcolor = "pink"; } else { name.style.backgroundcolor = "purple"; } } function startupdate(){ updatepage(); window.setinterval(updatepage,10 * 1000); } window.onload=startupdate;
how go making work?
the problem if statement
. never black background color.
see working jsfiddle demo
and should working updatepage function:
function updatepage() { var name = document.getelementbyid("fourth"); if (name.style.backgroundcolor == "black") { name.style.backgroundcolor = "pink"; name.style.color = "black"; } else { name.style.backgroundcolor = "black"; name.style.color = "pink"; } }
Comments
Post a Comment