Change background color permanently

Question

Can anyone assist on to make background change color permanently even after refresh using javascript after selecting color with colorpicker

<head>  
<meta charset="utf-8" />  
<title>HTML5 Color Picker Demonstrated</title>  
<script language="javascript">  
function newBackgroundColor(color)  
{  
 document.bgColor = color;  
 document.colorForm.selectedcolor.value = color;  
}  
</script>  
</head>  
<body bgcolor="white">  
<header>  
<h1>HTML 5 Color Picker Demonstrated</h1>  
</header>  
<form name="colorForm">  
  <p>Select Background Color  
  <input name="colorpicker" type="color"onchange="newBackgroundColor(colorpicker.value);">  
 </p>  
 <p>  
 Selected Color  
 <input name="selectedcolor" type="text">  
 </p>  
 </form>  
 </body>

See [Global Variable usage on page reload](http://stackoverflow.com/questions/29986657/global-variable-usage-on-page-reload/) — guest271314, Feb 01 '17 at 22:23
You're going to have to store the background color with something like `localStorage` or (as FrankZappa suggested) a cookie. — qxz, Feb 01 '17 at 22:24
This should get you started using `localStorage`: https://jsfiddle.net/qtu6k1Lf/ — APAD1, Feb 01 '17 at 22:32

score 0 · Answer 1 · answered Feb 01 '17 at 22:25

0

You can use localStorage to store the color value after setting it and check if its defined on load. And if not.. use deafault color

https://developer.mozilla.org/en/docs/Web/API/Window/localStorage

answered Feb 01 '17 at 22:25

Maher Fattouh

1,742
16
24

score -1 · Answer 2 · answered Feb 01 '17 at 22:21

-1

Why not use a cookie?

setCookie("background-color", document.bgColor, 365);

answered Feb 01 '17 at 22:21

FrankZappa

94
5

Where is `setCookie` defined? How would you read a cookie? – qxz Feb 01 '17 at 22:26
http://stackoverflow.com/a/9091013/947212 – FrankZappa Feb 01 '17 at 22:36

Change background color permanently

2 Answers2