943,712 Members | Top Members by Rank

Web Development > JavaScript / DHTML / AJAX > save and load font and background setting using cookies
Ad:
Permalink
Jan 14th, 2009
0

save and load font and background setting using cookies

Expand Post »
hi

i am new to javascript and i try to play around with it but i am stuck at the moment lol
hope that someone can help me check my code and tell me what is wrong with it

in the page the user can change the background color and the font family so when they open the website, the background and the font they selected is load back




JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1.  
  2. <html>
  3.  
  4. <head>
  5.  
  6. <!--background color function-->
  7. <script type="text/javascript">
  8. function changeBackgroundColor(elem, dropper) {
  9.   document.getElementById(elem).style.backgroundColor = dropper.options[dropper.selectedIndex].value;
  10. }
  11. </script>
  12.  
  13. <!--font family function-->
  14. <script type="text/javascript">
  15. function changeFontFamily(elem, dropper) {
  16.   document.getElementById(elem).style.fontFamily = dropper.options[dropper.selectedIndex].value;
  17. }
  18. </script>
  19.  
  20.  
  21.  
  22.  
  23.  
  24. <!--cookie script-->
  25. <script language="JavaScript">
  26. var expDays = 100;
  27. var exp = new Date(); 
  28. exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
  29.  
  30. function getCookieVal (offset) {  
  31. 	var endstr = document.cookie.indexOf (";", offset);  
  32. 	if (endstr == -1) { endstr = document.cookie.length; }
  33. 	return unescape(document.cookie.substring(offset, endstr));
  34. }
  35.  
  36. function GetCookie (name) {  
  37. 	var arg = name + "=";  
  38. 	var alen = arg.length;  
  39. 	var clen = document.cookie.length;  
  40. 	var i = 0;  
  41. 	while (i < clen) {    
  42. 		var j = i + alen;    
  43. 		if (document.cookie.substring(i, j) == arg) return getCookieVal (j);    
  44. 		i = document.cookie.indexOf(" ", i) + 1;    
  45. 		if (i == 0) break;   
  46. 	}  
  47. 	return null;
  48. }
  49.  
  50. function SetCookie (name, value) {  
  51. 	var argv = SetCookie.arguments;  
  52. 	var argc = SetCookie.arguments.length;  
  53. 	var expires = (argc > 2) ? argv[2] : null;  
  54. 	var path = (argc > 3) ? argv[3] : null;  
  55. 	var domain = (argc > 4) ? argv[4] : null;  
  56. 	var secure = (argc > 5) ? argv[5] : false;  
  57. 	document.cookie = name + "=" + escape (value) + 
  58. 	((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + 
  59. 	((path == null) ? "" : ("; path=" + path)) +  
  60. 	((domain == null) ? "" : ("; domain=" + domain)) +    
  61. 	((secure == true) ? "; secure" : "");
  62. }
  63.  
  64. function cookieForms() {  
  65. 	var mode = cookieForms.arguments[0];
  66. 	for(f=1; f<cookieForms.arguments.length; f++) {
  67. 		formName = cookieForms.arguments[f];
  68. 		if(mode == 'open') {	
  69. 			cookieValue = GetCookie('saved_'+formName);
  70. 			if(cookieValue != null) {
  71. 				var cookieArray = cookieValue.split('#cf#');
  72. 				if(cookieArray.length == document[formName].elements.length) {
  73. 					for(i=0; i<document[formName].elements.length; i++) {
  74. 						if(cookieArray[i].substring(0,6) == 'select') { document[formName].elements[i].options.selectedIndex = cookieArray[i].substring(7, cookieArray[i].length-1); }
  75. 						else if((cookieArray[i] == 'cbtrue') || (cookieArray[i] == 'rbtrue')) { document[formName].elements[i].checked = true; }
  76. 						else if((cookieArray[i] == 'cbfalse') || (cookieArray[i] == 'rbfalse')) { document[formName].elements[i].checked = false; }
  77. 						else { document[formName].elements[i].value = (cookieArray[i]) ? cookieArray[i] : ''; }
  78. 					}
  79. 				}
  80. 			}
  81. 		}
  82.  
  83. 		if(mode == 'save') {	
  84. 			cookieValue = '';
  85. 			for(i=0; i<document[formName].elements.length; i++) {
  86. 				fieldType = document[formName].elements[i].type;
  87. 				if(fieldType == 'password') { passValue = ''; }
  88. 				else if(fieldType == 'checkbox') { passValue = 'cb'+document[formName].elements[i].checked; }
  89. 				else if(fieldType == 'radio') { passValue = 'rb'+document[formName].elements[i].checked; }
  90. 				else if(fieldType == 'select-one') { passValue = 'select'+document[formName].elements[i].options.selectedIndex; }
  91. 				else if(fieldType == 'select-one') { passValue = 'select'+document[formName].elements[i].options.selectedIndex; }
  92. 				else { passValue = document[formName].elements[i].value; }
  93. 				cookieValue = cookieValue + passValue + '#cf#';
  94. 			}
  95. 			cookieValue = cookieValue.substring(0, cookieValue.length-4); 
  96. SetCookie('saved_'+formName, cookieValue, exp);		
  97. 		}	
  98. 	}
  99. }
  100. </script>
  101.  
  102. </head>
  103.  
  104. <body onload="cookieForms('open', 'yourform')" onunload="cookieForms('save', 'yourform')">
  105.  
  106. <form name="yourform" bgcolor = "yellow">
  107.  
  108. <div id="hey">
  109.  
  110. <center>
  111.  
  112. <td>
  113. <select onchange="changeBackgroundColor('hey', this);">
  114. <option value="">Background Color</option>
  115. <option value="Blue">Blue</option>
  116. <option value="Green">Green</option>
  117. <option value="Orange">Orange</option>
  118. <option value="Red">Red</option>
  119. <option value="Violet">Violet</option>
  120. <option value="Yellow">Yellow</option>
  121. </select>
  122. </td>
  123.  
  124. </br>
  125. </br>
  126.  
  127.  
  128. <td>
  129. <select onchange="changeFontFamily('hey', this);">
  130. <option value="">Font Family</option>
  131. <option value="Arial">Arial</option>
  132. <option value="Helvetica">Helvetica</option>
  133. <option value="Tahoma">Tahoma</option>
  134. <option value="Times New Roman">Times New Roman</option>
  135. <option value="Verdana">Verdana</option>
  136. </select>
  137. </td>
  138.  
  139.  
  140. </br>
  141. </br>
  142. <a onClick=document.getElementById('hey').style.backgroundColor='red'> Make it Red!</a> ----
  143. <a onClick=document.getElementById('hey').style.backgroundColor='#99FFCC'> Make it Sort of Green!!!</a>
  144.  
  145. </br>
  146. </br>
  147. <a onClick=document.getElementById('hey').style.fontSize='10'> Make it Tiny!</a> ----
  148. <a onClick=document.getElementById('hey').style.fontSize='24'> Make it HUGE!!!</a>
  149.  
  150. </br>
  151. </br>
  152. <a onClick=document.getElementById('hey').style.fontFamily='courier'> Make it COURIER!</a> ----
  153. <a onClick=document.getElementById('hey').style.fontFamily='verdana'> Make it VERDANA!!!</a>
  154.  
  155. </br>
  156. </br>
  157.  
  158.  
  159. <p>Text Fields: 
  160.   <input type="text" name="1" value="">
  161.  </p>
  162.  <p>Passwords: 
  163.   <input type="password" name="2" value="">
  164.   <br>
  165.   (won't be saved)</p>
  166.  <p>TextAreas: 
  167.   <textarea name="3"></textarea>
  168.  </p>
  169.  <p>Dropdowns: 
  170.   <!--<select name="4">-->
  171.  <td>
  172. <select onchange="changeBackgroundColor('hey', this);">
  173. <option value="">Background Color</option>
  174. <option value="Blue">Blue</option>
  175. <option value="Green">Green</option>
  176. <option value="Orange">Orange</option>
  177. <option value="Red">Red</option>
  178. <option value="Violet">Violet</option>
  179. <option value="Yellow">Yellow</option>
  180. </select>
  181. </td>
  182.  
  183.  <p>Checkboxes: 
  184.   <input type="checkbox" name="5" value="ummm">
  185.  </p>
  186.  
  187.  <p>Radio Buttons: 
  188.   <input type="radio" name="6" value="snuh">
  189.   <input type="radio" name="6" value="whuf">
  190.  </p>
  191.  
  192.  </div>
  193.  
  194.  
  195. </form>
  196.  
  197.  
  198.  
  199.  
  200.  
  201.  
  202.  
  203.  
  204. <!--not yet implemented-->
  205. </br>
  206. </br>
  207. <input type=button value="Save Cookie!" onClick="javascript:changeBG(this)">
  208.  
  209. <!--not yet implemented-->
  210. </br>
  211. </br>
  212. <input type=button value="Reset to Default!" onClick="javascript:changeBG(this)">
  213.  
  214.  
  215.  
  216.  
  217.  
  218. </body>
  219. </html>
  220.  



try copy and paste my code first

if someone select the value in the background color to red, when they reload the page the value in the list box still red
but the page color is not red, it is back to white again
i dont know how to make the page red

can you guys help me please.

thank you

regards,

ayi
Reputation Points: 10
Solved Threads: 0
Light Poster
ayi_102 is offline Offline
27 posts
since Nov 2008
Permalink
Jan 15th, 2009
0

Re: save and load font and background setting using cookies

Hi there! Heres the conclusion to your 1st query regarding changing the looks of your page.
This script wil load specific themes' using different style sheets depending on the selection being provided by the user and of course with the help of cookies. It's a compact script, hope youll enjoy this...

javascript Syntax (Toggle Plain Text)
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <?xml-stylesheet type="text/css" href="#inline" media="all"?>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  4.    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6.    <head>
  7.       <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  8.       <meta http-equiv="Content-Script-Type" content="text/javascript" />
  9.       <meta http-equiv="Content-Style-Type" content="text/css" />
  10.       <title>Essential's Demo</title>
  11. <style id="inline" type="text/css" media="all">
  12. body { background-color: #00F; color: #FFF; }
  13. </style>
  14.  
  15. <script type="text/javascript">
  16. /* (c) Copyright 2008-2009 Essential Works. All rights reserved. ~ 
  17.  
  18.    Permission granted for the use of this script, as long as all credits ramain as is.
  19.  
  20.    This code has been tested and before released and working 100% with OP8 and IE */
  21.  
  22. function setCookie(name, value, expires, path, domain, secure) {
  23.    expires =  expires  ? '; expires=' + expires.toGMTString() : '';
  24.    path =  path  ? '; path=' + path : '';
  25.    domain = domain  ? '; domain=' + domain : '';
  26.    secure =  secure ? '; secure' : '';
  27.    var cookies = name + '=' + escape(value) + expires + path + domain + secure;
  28. document.cookie = cookies;
  29. }
  30.  
  31. function getCookie(name) {
  32.    var thisName = name + '=';
  33.    var firstIndex = document.cookie.indexOf(thisName);
  34.       if (firstIndex == -1) { return null; }
  35.    var lastIndex = document.cookie.indexOf(';',firstIndex + thisName.length);
  36.       if (lastIndex == -1) { lastIndex = document.cookie.length; 
  37. return unescape(document.cookie.substring(firstIndex + thisName.length, lastIndex)); }
  38. }
  39.  
  40. function deleteCookie(name, path, domain) {
  41. if (getCookie(name)) {
  42. document.cookie = name +"=" + path + domain +
  43. "; expires=Thu, 01-Jan-10 00:00:01 GMT"
  44. } }
  45. function cookieDate(date) {
  46.    var thisDate = new Date(0);
  47.    var refDate = thisDate.getTime();
  48.  
  49.       if ( refDate > 0 ) { date.setTime(date.getTime() - refDate); }
  50. }
  51.  
  52. function saved() {
  53. var now = new Date();
  54. cookieDate(now)
  55.  
  56. var lists = document.all ? document.all.frm : document.forms['frm'];
  57.  
  58. now.setTime(now.getTime() + (31 * 24 * 60 * 60 * 1000));
  59.    var name = getCookie('name');
  60.    name = lists.lst.options[lists.lst.selectedIndex].value;
  61.    setCookie('name', name, now);
  62. }
  63. function themes() {
  64.  
  65. var loadStyle = document.all ? document.all.inline : document.getElementById('inline');
  66.  
  67. /* There are alot of ways to this, just keep those mind workin. Here's the basic of it and i hope you appreciate this. */
  68.  
  69. var form = document.all ? document.all.frm : document.forms['frm'];
  70.  
  71. /* Ok, let's say (for example you have this two style sheets, named as "black.css" and the other one is "white.css") 
  72.   Now all you need to do is to - apply specific rules on this css documents, which is the "black.css" and "white.css"
  73. */
  74.  
  75. switch(getCookie(name)) {
  76. case 'black.css' : form.lst.selectedIndex = 1; break;
  77. case 'white.css' : form.lst.selectedIndex = 2; break;
  78. default : alert('Please select a theme on the list!'); } 
  79. loadStyle.innerHTML = '@import "' + getCookie(name) + '";'; }
  80.  
  81. if (window.addEventListener) 
  82. window.addEventListener('load',themes,false);
  83. else if (window.attachEvent)
  84. window.attachEvent('onload',themes);
  85. else if (document.getElementById)
  86. window.onload = theme;
  87.  
  88. </script>
  89.    </head>
  90.    <body>
  91. <h1>Essential Works</h1>
  92. <form id="frm" action="javascript:void(0);">
  93. <div>
  94. <select name="lst" size="1" onchange="saved();">
  95. <option value="none" selected="selected">Select Your Theme</option>
  96.  
  97. <!-- Path or filename of your CSS must be declared from the value of this OPTION ~
  98. black.css is the default -->
  99.  
  100. <option value="black.css">Black Theme</option>
  101. <!-- Same process must be applied on this OPTION ~
  102. default is white.css -->
  103. <option value="white.css">White Theme</option>
  104. </select>
  105. </div>
  106. </form>
  107.    </body>
  108. </html>
Featured Poster
Reputation Points: 114
Solved Threads: 138
Posting Shark
essential is offline Offline
973 posts
since Aug 2008
Permalink
Jan 15th, 2009
0

Re: save and load font and background setting using cookies

if i have lots of option like change the background color : blue, red, black, green and fontfamily : tahoma, arial, verdana fontcolor: red,green, blue

that will be mean that i have to make css file for each possibility that will happen? like blue bgcolor, tahoma, red font then blue bgcolor, arial, green font

howdo you make one cookies with lots of different name?
Reputation Points: 10
Solved Threads: 0
Light Poster
ayi_102 is offline Offline
27 posts
since Nov 2008
Permalink
Jan 15th, 2009
0

Re: save and load font and background setting using cookies

Just a sets of theme so you dont have to choose for the font, font sizes, color, bgcolor and so on...
Ok assuming that i have the following rules in the "black.css"
css Syntax (Toggle Plain Text)
  1. body {
  2.      borderd: none;
  3.      backgroud-color: #000;
  4.      color: #ccc;
  5.      font: normal 12pt/105% Georgia, Arial, sans-serif;
  6. }
You can provide themes as many as you want. The ones you use depends only on your design capabilities and imagination.
Featured Poster
Reputation Points: 114
Solved Threads: 138
Posting Shark
essential is offline Offline
973 posts
since Aug 2008
Permalink
Jan 15th, 2009
0

Re: save and load font and background setting using cookies

this is my latest code

there are several option for user

background color = red, green, blue
font color = red, green, blue, black
font type = arial, times, verdana, tahoma
font size = small, medium, large, x-large, xx-large

lets assume that someone want to choose:
background color = red
font color = green
font type = verdana
font size = medium

that is mean that i have to make css page that can handle those requirements

what about if that person want to change the page like:
background color = green
font color = blue
font type = times
font size = xx-large

that is another page which is mean another css file, right

so there gonna be lots of css then to meet all the possibilities that can happens

What do you think?

Oh, and thank you for the cookies code
it works perfect

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <html>
  2. <head>
  3.  
  4. <title>None</title>
  5.  
  6. <!--font family function-->
  7. <script type="text/javascript">
  8. function changeFontFamily(elem, dropper) {
  9.   document.getElementById(elem).style.fontFamily = dropper.options[dropper.selectedIndex].value;
  10. }
  11. </script>
  12.  
  13. <!--font color function-->
  14. <script type="text/javascript">
  15. function changeFontColor(elem, dropper) {
  16.   document.getElementById(elem).style.color = dropper.options[dropper.selectedIndex].value;
  17. }
  18. </script>
  19.  
  20. <!--background color function-->
  21. <script type="text/javascript">
  22. function changeBackgroundColor(elem, dropper) {
  23.   document.getElementById(elem).style.backgroundColor = dropper.options[dropper.selectedIndex].value;
  24. }
  25. </script>
  26.  
  27. <!--font size function-->
  28. <script type="text/javascript">
  29. function changeFontSize(elem, dropper) {
  30.   document.getElementById(elem).style.fontSize = dropper.options[dropper.selectedIndex].value;
  31. }
  32. </script>
  33.  
  34. <!--create cookies function-->
  35. <!--save cookies function-->
  36. <!--delete cookies function-->
  37.  
  38.  
  39. <!--cookies function-->
  40.  
  41.  
  42. </head>
  43. <body>
  44.  
  45. <form>
  46.  
  47.  
  48. <!--This is where the changes happen-->
  49. <div id="test">This is supposed to be a nice little navbar. Select a new font to change this one's</div>
  50.  
  51. </br>
  52. </br>
  53. <div id="position" style="visibility:visible;position:absolute;bottom:0px; right:0px">
  54. <center>
  55. <table width="100%" border ="4" background="raindrop.jpg" >
  56.  
  57. <td>
  58. <select onchange="changeFontFamily('test', this);">
  59. <option value="">Font Family</option>
  60. <option value="Arial">Arial</option>
  61. <option value="Helvetica">Helvetica</option>
  62. <option value="Tahoma">Tahoma</option>
  63. <option value="Times New Roman">Times New Roman</option>
  64. <option value="Verdana">Verdana</option>
  65. </select>
  66. </td>
  67.  
  68. <td>
  69. <select onchange="changeFontColor('test', this);">
  70. <option value="">Font Color</option>
  71. <option value="Black">Black</option>
  72. <option value="Blue">Blue</option>
  73. <option value="Green">Green</option>
  74. <option value="Orange">Orange</option>
  75. <option value="red">Red</option>
  76. <option value="Violet">Violet</option>
  77. <option value="Yellow">Yellow</option>
  78. </select>
  79. </td>
  80.  
  81. <td>
  82. <select onchange="changeBackgroundColor('test', this);">
  83. <option value="">Background Color</option>
  84. <option value="Blue">Blue</option>
  85. <option value="Green">Green</option>
  86. <option value="Orange">Orange</option>
  87. <option value="Red">Red</option>
  88. <option value="Violet">Violet</option>
  89. <option value="Yellow">Yellow</option>
  90. </select>
  91. </td>
  92.  
  93. <td>
  94. <select onchange="changeFontSize('test', this);">
  95. <option value="">Font Size</option>
  96. <option value="x-small">X-Small</option>
  97. <option value="small">Small</option>
  98. <option value="medium">Medium</option>
  99. <option value="large">Large</option>
  100. <option value="x-large">X-Large</option>
  101. <option value="xx-Large">XX-Large</option>
  102. </select>
  103. </td>
  104. </table>
  105. </center>
  106. </div>
  107.  
  108.  
  109. <!--not yet implemented
  110. </br>
  111. </br>
  112. <input type=button value="Save Cookie!" onClick="javascript:changeBG(this)">
  113. -->
  114.  
  115. <!--not yet implemented
  116. </br>
  117. </br>
  118. <input type=button value="Reset to Default!" onClick="javascript:changeBG(this)">
  119. -->
  120.  
  121.  
  122.  
  123. </body>
  124. </html>
  125.  
Reputation Points: 10
Solved Threads: 0
Light Poster
ayi_102 is offline Offline
27 posts
since Nov 2008
Permalink
Jan 15th, 2009
0

Re: save and load font and background setting using cookies

This one is working example

but i want to change it into listbox instead of radio button

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <html>
  2.  
  3. <head>
  4.  
  5. <script type="text/javascript">
  6. function bakeCookie(name,value){
  7.   args=arguments;argc=args.length;
  8.   expires=(argc>2) ? args[2] : null;
  9.   path=(argc>3) ? args[3] : null;
  10.   domain=(argc>4) ? args[4] : null;
  11.   secure=(argc>5) ? args[5] : false;
  12.   expDate=new Date();day=24*60*60*1000;
  13.   if(expires){expDate.setTime(expDate.getTime()+expires*day);}
  14.   document.cookie=name+"="+escape(value)+
  15.     ((expires===null) ? "" : ("; expires="+expDate.toUTCString()))+
  16.     ((path===null) ? "" : ("; path="+path))+
  17.     ((domain===null) ? "" : ("; domain="+domain))+
  18.     ((secure===true) ? "; secure" : "");
  19. }
  20. </script>
  21.  
  22. <script type="text/javascript">
  23. function eatCookieVal(name) {
  24.   endstr=document.cookie.indexOf(";",name);
  25.   if(endstr===-1) {endstr=document.cookie.length;}
  26.   return unescape(document.cookie.substring(name,endstr));
  27. }
  28. function eatCookie(name) {
  29.   arg=name+"="; alen=arg.length;
  30.   clen=document.cookie.length; i=0;
  31.     while (i<clen) {
  32.       j=i+alen;
  33.       if(document.cookie.substring(i,j)===arg){
  34.         return eatCookieVal(j);
  35.         }
  36.       i=document.cookie.indexOf(" ",i)+1;
  37.       if(i===0){break;}
  38.    }
  39. }
  40. </script>
  41.  
  42. <script type="text/javascript">
  43. function newColor2(entry,areaID){ // use DOM method
  44.   bakeCookie("colorSet",entry,7); // save for a week
  45.   if (!areaID){areaID="body";} // default to whole body
  46.   document.getElementById(areaID).style.background=entry;
  47. }
  48. </script>
  49.  
  50. <script type="text/javascript">
  51. function newFont(entry,areaID){ // use DOM method
  52.   bakeCookie("fontSet",entry,7); // save for a week
  53.   if (!areaID){areaID="body";} // default to whole body
  54.   document.getElementById(areaID).style.fontFamily=entry;
  55. }
  56. </script>
  57.  
  58. <script type="text/javascript">
  59. function isColorSet(areaID) { // points at color element
  60.  
  61.   colorSet=null;
  62.   if(!(colorSet=eatCookie("colorSet"))){colorSet=null;}
  63.   if(colorSet!==null){newColor2(colorSet,areaID);}
  64.  
  65.   fontSet=null;
  66.   if(!(fontSet=eatCookie("fontSet"))){fontSet=null;}
  67.   if(fontSet!==null){newFont(fontSet,areaID);}
  68.  
  69. }
  70. </script>
  71.  
  72. </head>
  73.  
  74. <!--Start the html body-->
  75. <body id="body" onload="isColorSet()">
  76. <form action="" onsubmit="return false;">
  77.  
  78. <fieldset>
  79. <legend>Radio Background Color Selector</legend>
  80. <label>Aquamarine:<input name="radCol" type="radio"
  81. onclick="newColor2('Aquamarine');"/></label>
  82. <label>Burlywood:<input name="radCol" type="radio"
  83. onclick="newColor2('Burlywood');"/></label>
  84. <label>Floralwhite:<input name="radCol" type="radio"
  85. onclick="newColor2('Floralwhite');"/></label><br>
  86. <label>Goldenrod:<input name="radCol" type="radio"
  87. onclick="newColor2('Goldenrod');"/></label>
  88. <label>Peachpuff:<input name="radCol" type="radio"
  89. onclick="newColor2('Peachpuff');"/></label>
  90. </fieldset>
  91.  
  92. </br>
  93. </br>
  94.  
  95. <fieldset>
  96. <legend>Radio Background Font Selector</legend>
  97. <label>Verdana:<input name="radCol" type="radio"
  98. onclick="newFont('Verdana');"/></label>
  99. <label>Arial:<input name="radCol" type="radio"
  100. onclick="newFont('Arial');"/></label>
  101. <label>Tahoma:<input name="radCol" type="radio"
  102. onclick="newFont('Tahoma');"/></label>
  103. </fieldset>
  104.  
  105. </br>
  106. </br>
  107.  
  108. <fieldset>
  109. <legend>Listbox Color Selector</legend>
  110. <select onchange="newColor2('body', this);">
  111. <option value="">Background Color</option>
  112. <option value="Blue">Blue</option>
  113. <option value="Green">Green</option>
  114. <option value="Orange">Orange</option>
  115. <option value="Red">Red</option>
  116. <option value="Violet">Violet</option>
  117. <option value="Yellow">Yellow</option>
  118. </select>
  119. </fieldset>
  120.  
  121. </br>
  122. </br>
  123.  
  124. BLA BLA BLA BLA BLABLA BLA BLA BLA
  125.  
  126. </form>
  127.  
  128. </body>
  129.  
  130. </html>


it works with radio button but not with listbox
i dont know how to make the listbox works

hope that someone can help me

thank you
Reputation Points: 10
Solved Threads: 0
Light Poster
ayi_102 is offline Offline
27 posts
since Nov 2008

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: Word press and javascript
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: Display iframe source in web browser's address bar





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC