www.webdeveloper.com
Results 1 to 2 of 2

Thread: Reuse function misunderstanding

  1. #1
    Join Date
    Feb 2013
    Posts
    13

    Reuse function misunderstanding

    Hello everyone. I am stuck and have exhausted all my resources on this lol. I couldn't possibly list everything I have tried. I have a misunderstanding about how to get my function to work properly with the IF statement inside it. What I am trying to do is have two select boxes with 5 options of colors. One box will change the background color and the other will change the font color. I have been able to make the colors change but I need it to be done in 1 function. Here is where my problem starts. I cannot get the IF statement to work accordingly to the select box being used. I am pretty sure that my condition for the IF itself is the whole problem. If some could help me understand where I went wrong and why, maybe point to some material I have not found too. Thanks

    HTML:
    HTML Code:
    <select id="background" class="select" onChange="changeColor("background")">
                <option value='#B40404'>red</option>
    	    <option value='#FFFFFF'>white</option>
                <option value='#0404B4'>blue</option>
                <option value='#298A08'>green</option>
                <option value='#FFFF00'>yellow</option>
    </select>
    <select id="font" class="select" onChange="changeColor("font")">
                <option value='1'>red</option>
    	    <option value='2'>white</option>
                <option value='3'>blue</option>
                <option value='4'>green</option>
                <option value='5'>yellow</option>
    </select>
    JavaScript:
    Code:
    function changeColor(object) {
    var background = document.getElementById("background");
    var font = document.getElementById("font");
    var colors = new Array();
    var allElems = document.getElementsByTagName("*");
    
    	if (background == "background"){
    		for (var i = 0; i < allElems.length; i++){
    			if (allElems[i].className == "body") colors.push(allElems[i]);
    		}
    		var bg = (background.options[background.selectedIndex].value);
    		if (bg) {
    			document.getElementsByTagName("body")[0].style.backgroundColor = bg;
    		}
    		alert("The background color has changed to "+bg)
    	} else if (object == "font"){
    		for (var i = 0; i < allElems.length; i++){
    			if (allElems[i].className == "body") colors.push(allElems[i]);
    		}
    		var bg = (font.options[font.selectedIndex].value);
    		if (bg) {
    			document.getElementsByTagName("body")[0].style.backgroundColor = bg;
    		}
    		alert("The color has changed to "+bg)
    	}
    }}

  2. #2
    Join Date
    Feb 2013
    Posts
    13
    I was able to figure it out. Thank you

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles