0

im sorry if my Question duplicated but i need help im trying to save the selected color to localstorage and keep the last selected color after reload the page. i mean to get last saved color inside localstorage and kep the box with last selected color after reload the page any idea?

const box = document.querySelector(".box");
const colorInput = document.querySelector("input");
const currentColorSpan = document.querySelector("#currentColorSpan");

colorInput.addEventListener("input", () => {
  box.style.backgroundColor = colorInput.value;
  currentColorSpan.textContent = colorInput.value;
});
.box {
  width: 600px;
  height: 360px;
  border: solid 1px grey;
}
<div class="box">color slected not saved yet inside localstorag</div>
<label>click picker to choose color</label>
<input type="color" value="#ffffff"/>
<p>current color: <span id="currentColorSpan"></span></p>
Ahmed El Sheikh
  • 73
  • 1
  • 9
  • 1
    possible duplicate [Keep CSS from refreshing on page reload](https://stackoverflow.com/questions/48441624/keep-css-from-refreshing-on-page-reload) – Dean May 02 '18 at 02:50
  • no sir its far way from answer..i need to save selected color from picker and bring it back after reload watch this example http://www.mustbebuilt.co.uk/demo/html5-js/localstorage.html but this example for body background ...i need to set background for div or clas – Ahmed El Sheikh May 02 '18 at 15:13

0 Answers0